Positioning without tables
I'm working on rewriting some CSS and I want to be sure I'm doing it properly.
I need to position 2 images and 3 menus. There's a left menu, two top menus (a top nav and utility nav), and two images that are basically placed side by side. The way they are currently styled is through a table which we're trying to avoid.
I was going to use position:relative; but I did some quick research to see if this could cause problems later and apparently it can. So I'm wondering what the best way to do this is. I'm trying to write this code in a way that will cause minimal problems later.
If it matters any, we're using Joomla and since I don't fully understand how you theme in Joomla yet, I don't know if that changes anything or not.
The best way to do this is with floats, margins, and paddings. Here's a basic example:
I'm not sure if the link works in Internet Explorer.
Thank you very much, I appreciate it!
I use table-free layouts on all of my web sites and pages. If you visit the page listed in my signature block below you can see how it works by checking (right click) the source code. You can check the stylesheet by clicking on the CSS validator link toward the bottom of center section. Feel free to use any code snippets you find to your liking.
Visit my page http://jp29.org/floatbox.htm to see how to array horizontal boxes using CSS.
Last edited by polyglot; 01-17-2013 at 12:05 PM.
Reason: added missing word
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)