5 replies [Last post]
slippy
Offline
Enthusiast
Last seen: 8 years 30 weeks ago
Timezone: GMT+1
Joined: 2005-01-24
Posts: 155
Points: 4

I've got 3 floats aligned in a row which all work fine but when I place a list in the second float it pushes the right float underneath. This can be seen here:

http://tinyurl.com/32ba4j

I would have thought it would be a width problem with the list in the middle float but I have set with no excess width measurements it should sit happily in its containing float (or so I would expect). I've left about 6 pixels space incase all three floats are spilling out of their container but this doesn't seem to make a difference.

Can anyone suggest why it's shifting underneath when the list is placed inside the middle float?

Thanks

sticks464
Offline
Enthusiast
Topeka, KS.
Last seen: 9 years 1 week ago
Topeka, KS.
Timezone: GMT-6
Joined: 2006-10-18
Posts: 116
Points: 71

It is a width

It is a width problem.
wrapper=960px
col1=230px
col2=710px
col3=70px
TOTAL width for the columns=1010px inside the 960px wide wrapper. ??

slippy
Offline
Enthusiast
Last seen: 8 years 30 weeks ago
Timezone: GMT+1
Joined: 2005-01-24
Posts: 155
Points: 4

I'm not sure where you got

I'm not sure where you got col-3 from. If you have another look at the code you'll see there are only 2 columns:

Width: 960px

col-1=230px
col-2=710px

TOTAL: 940px

Maybe you're getting confused with the blocks or heading:

#tertiary h3 { padding: 20px 70px 0 0; }

The three "blocks" sit inside col-2 like this:

col-2=710px

block-1=220px (+ 20px padding-right)
block-2=220px (+ 20px padding-right)
block-3=220px

TOTAL: 700px

So it has 10px spare. This is why I said I didn't think it was a width problem.

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 2 hours 54 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9774
Points: 3856

Check your source. You have

Check your source. You have block 3 nested within block 2.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Vade
Vade's picture
Offline
Enthusiast
Ireland
Last seen: 10 years 1 week ago
Ireland
Joined: 2007-08-13
Posts: 315
Points: 276

Shouldn't your block-2 div

Shouldn't your block-2 div close before you begin your block-3? As it stands you have block-3 contained within block-2 so it very correctly sits in the available space at the bottom.

I changed it to..


Block 2


  • Donec eget augue et

  • Donec eget augue et

  • Donec eget augue et

  • Donec eget augue et

  • Donec eget augue et

  • Donec eget augue et

  • Donec eget augue et

  • Donec eget augue et





  • Block 3

    Quisque facilisis. Vestibulum id ipsum sit amet tellus pellentesque pellentesque.


    seems to work.

    Gary just sniped me at the finish, well played good sir Tongue

    slippy
    Offline
    Enthusiast
    Last seen: 8 years 30 weeks ago
    Timezone: GMT+1
    Joined: 2005-01-24
    Posts: 155
    Points: 4

    Well spotted guys. I should

    Well spotted guys. I should have known it would be something as simple as that Tongue I've updated the markup and it works fine now:

    http://tinyurl.com/32ba4j

    Thanks for the help guys! Smile