How can I get my divs to line up side by side?

February 4th, 2009 · No Comments

Hello Janine,

I’m a big fan of your Dreamweaver training videos on Total Training. Thanks for making things clear and easy to understand.

One problem I’m having that’s driving me bonkers is concerning “Aligning Divs Side by Side” (DW CS3 Essentials–Chapter 5 Lesson 10).  My divs line up side by side just fine until I view them in a browser. Then they’re stacked down the page on top of one another instead of remaining side by side.

I’m using Leopard OSX, if that has anything to do with it.

Thank you very much for your time : )

Nathan

Hi, Nathan,

Thanks for your kind words about my training videos. Unfortunately, different browsers display padding differently, which can cause side-by-side divs to drop one below the other.

There are a few solutions. A simple adjustment is to make the divs a little narrower and/or remove some of the padding or margin space. This can result in having a little more margin on the far right than you might prefer, but it will ensure your pages work in all Web browsers.

Another option is to start with one of the predesigned CSS layouts included in Dreamweaver. These are created with a different approach than I used in that video and seem to hold up better with a variety of browsers. You’ll find a free written tutorial on how to customize a CSS layout in Dreamweaver on my site at www.DigitalFamily.com/dreamweaver

Finally, a great reference for testing your site design in many Web browsers at once is www.browsershots.org.

Hope that helps and I wish you all the best,

Janine

Still want more? Visit the Dreamweaver Help Center at www.DigitalFamily.com/dreamweaver to find Dreamweaver tips, tricks, and tutorials.

Tags: Dreamweaver CS3

0 responses so far ↓

  • There are no comments yet...Kick things off by filling out the form below.

You must log in to post a comment.