<DIV> alignment issue

[kennybr2]

http://www.russstudio.com/temp/russStudioV3/index.htm
http://www.russstudio.com/temp/russStudioV3/source.htm


At the very bottom, three out of the five <div>s are not lining up horizontally as intended. Each <div> has a separate class, and the left-margin on each class should place them next to eachother, however its pushing the last 3 <div>s to their own row.

Can anyone offer any suggestions as to why and how this can be resolved? I can easily eliminate the problem by using a table, however I would rather not.

Cheers!

 

[PTNL]

I think it comes down to a combination of negative margins, left paddings, and some other stuff ("list" tags can sometimes be a pain in certain scenarios).

I think that to really troubleshoot this better, you should abstract your footers into common blocks that use proper floats and paddings. Something like the "Floating Thumbnail Example 2" found here:
http://realworldstyle.com/thumb_float.html

Take that high-level concept and drop it within your #footer content block. This will have you troubleshooting far less CSS than turning each footer sub-logical block into their own independently managed class.

I think once that is done (and plus a little subjective tweaking), you'll be able to get the display layout you want.

 

[kennybr2]

---SOLVED---

PTNL - thanks for the link.

I don't understand what you are suggesting here:

Take that high-level concept and drop it within your #footer content block

 

[PTNL]

---SOLVED---

PTNL - thanks for the link.

I don't understand what you are suggesting here:

Glad you got it resolved.

To clarify the "high level" concept part ... I meant just to apply the idea behind what that link showed where you have a single standard floating block that is used as many times as you need, and then encapsulate all of these sub-blocks within your "footer" div.