Login | Register | FAQ
Anonymous

Help with 3-column CSS

+ Post a reply

8 posts Page 1 of 1


Help with 3-column CSS

by rswebs » Tue Dec 21, 2010 4:20 pm

i want to re-organize my website adding 3 columns with css. the left nav, the body, and the right nav., but when i put float right on the right nav the body box goes shorter and sometimes it moves to the bottom and the footer moves to a different location.

i hope the forum can understand what im trying to say.

thanks
User avatar

rswebs

  • Posts: 77
  • Joined: Wed Nov 24, 2010 6:47 am
--
Thanks Rafael - www.htmltutorialtopics.com

Re: Help with 3-column CSS

by lacroixz » Tue Dec 21, 2010 7:10 pm

Like this? http://mauricet.ma.funpic.org/column/test.html
User avatar

lacroixz

  • Posts: 74
  • Joined: Wed Oct 27, 2010 9:26 pm

Re: Help with 3-column CSS

by nsdeammmae » Fri Dec 31, 2010 2:32 am

Can you post your css code.
User avatar

nsdeammmae

  • Posts: 8
  • Joined: Fri Dec 31, 2010 1:18 am
  • Location: augesoft.com

Re: Help with 3-column CSS

by howardgreet » Tue Apr 12, 2011 10:54 am

To fix the footer problem, what I do is that i'd place those 3 divs to a container div. On that container div, I'd assign a clearfix class (somekind of solution I got from a nettuts site).
Code: Select all
.clearfix:after { content: " "; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
.clearfix { display: block; }


For those 3 divs, I'd assign the appropriate widths and a float:left; for each.
User avatar

howardgreet

  • Posts: 4
  • Joined: Tue Apr 12, 2011 10:29 am
--
Jumpstart your fitness and know how to get better results with perfit personal training

Re: Help with 3-column CSS

by fishtoon » Thu May 19, 2011 5:52 am

Hello rswebs, You may see the tutorial for 3-column CSS
http://www.lazywebdesign.com/cssdiv-3-column-page-layout/104
User avatar

fishtoon

  • Posts: 2
  • Joined: Thu May 19, 2011 5:47 am

Re: Help with 3-column CSS

by akashtablet » Sat Jan 28, 2012 4:47 pm

Keep all your divs in float left position and make their width to 20% 60% 20% respectively. Now your all three divisions will be aligned to left. You can set the padding to keep the text separated from each other.
User avatar

akashtablet

  • Posts: 50
  • Joined: Fri Jan 27, 2012 8:24 pm
  • Location: India
--
The computing and fun with click for Micromax fun book

Re: Help with 3-column CSS

by steveelkins » Mon Feb 27, 2012 10:50 pm

I have a hard time getting my padding set on my own website. It's a bit of trial and error when I do it. Is there an easier way to find out how much you need to edit it for the website to look nice? It takes me a dozen or more times to get the padding right and my girlfriend makes fun of me because I build websites for a living.
User avatar

steveelkins

  • Posts: 12
  • Joined: Mon Feb 27, 2012 8:42 am
--
Is there a certain type of HTML I should be using when trying to create an e-commerce store that sells a survival seed bank supply? I want something that will help me to target gardeners that are interested in my product.

Re: Help with 3-column CSS

by XainPro » Tue Mar 06, 2012 7:55 pm

steveelkins wrote:I have a hard time getting my padding set on my own website. It's a bit of trial and error when I do it. Is there an easier way to find out how much you need to edit it for the website to look nice? It takes me a dozen or more times to get the padding right and my girlfriend makes fun of me because I build websites for a living.

steveelkins
Practice Make Men Perfect
User avatar

XainPro

  • Posts: 3661
  • Joined: Fri Feb 17, 2012 8:10 pm


+ Post a reply

Page 1 of 1