[SOLVED] 3 columns?

[PicoDeath]

http://www.leoncalder.com/clients/housing/
http://www.leoncalder.com/clients/housing/style.css

How come the 3 headings below the image aren't level? I'm pretty sure that's how it's supposed to be done(coding). Anyone spot the problem?

[Stuart]

Try adding float:left; to #boxcontainer. I think the reason that this is happening is that the content above the left box is "shorter".

[dab42pat]

try replacing your code with the code below .

HTML: Select all

#left {
width: 352px;
height: 232px;
float: left;
padding: 19px;
}

[Monie]

Do you mean the blue colored button? It's perfect the way I looked at it.

[Marc]

Have you fixed this issue now? I don't see any problems in Firefox.

[PicoDeath]

Yep, dabs fixed the issue.

However, look again and now I need 3 boxs below them.

Also there's a small error with the picture in IE6.

Any ideas? Mostly need the box one sorted asap.

[Marc]

The page is completely mucked up in Firefox. See my attachment.

[PicoDeath]

... I know, that's what my post is about. It completely messed up when i added the other 3 boxs.

I can do it using another 3 divs easyily, maybe that's the best position.

[Marc]

Have you cleared your floats from above?

[welshstew]

you need to change your box content div to the followg:

HTML: Select all

<div id="boxcontainer">
    <div id="box1"/>
<div id="box2"/>
<div id="box3"/>
<div style="clear: both;"/>
    <div class="boxcontent">46546</div>
    <div class="boxcontent">46546</div>
    <div class="boxcontent">46546</div>
    </div>

and then remove the

Code: Select all

clear:both

on the boxcontent css
that should clean it up for you

edit: screen shot attached

[Stuart]

Woah! Stew, what's with your browser? Looks very... holiday-ish

[PicoDeath]

Thanks a lot, I'll update it later.

[welshstew]

Originally Posted by PicoDeath

Thanks a lot, I'll update it later.

No probs

Originally Posted by swagner

Woah! Stew, what's with your browser? Looks very... holiday-ish

Tis the season mas:

[PicoDeath]

How come there's a bigger gap between the first box than the 2nd/3rd box?

[dab42pat]

If you remove

margin-right: 2px; from #boxcontent 1 and border-right:2px solid #ffffff; from #box 1 that should even things up.

then add margin-left:2px to #boxcontainer

[dab42pat]

It may also be an idead to alter your footer gif to fit a width of 753px and adjust the footer div width to the same. That should line up everything.

[Monie]

Is it FF extension Welshstew? nice one..

[Stuart]

Originally Posted by monie

Is it FF extension Welshstew? nice one..

Found it! Tinseltown

[Monie]

Installing....

[Stuart]

Me too!