  (This is reposted from urlLink a.s.s.d ) Getting around layout images and tables: Given the new constraints on images due to bandwidth, it's time to get people a little familiar with one of the tricks of CSS.
Images and tables are often used to make a page lay itself out -just- right. However they load slow and tables can cause some text only browsers to get things in the wrong order. To layout without them, you use the &lt;DIV&gt; tag. First put all your content on your page in the order you want it to appear if it was being printed out for say... a school paper... or scrolling by on your TV. In other words, put it all in a top to bottom order - the top is what is seen first in this horrid situation, the bottom last. Now put a &lt;DIV&gt; and &lt;/DIV&gt; tag around each block of content - one for your header, one for your navigation, one for your body, one for your footer, and so on... Like this: &lt;DIV&gt;Welcome to my page&lt;/DIV&gt; &lt;DIV&gt; click here or here or maybe here &lt;/DIV&gt; &lt;DIV&gt; Read this useless nonsense I happen to like. &lt;/DIV&gt; &lt;DIV&gt; Donate to ASSTR - Copyright me, today - contact me here &lt;/DIV&gt; Now for each DIV tag you do this: Change that plain old &lt;DIV&gt; to: &lt;DIV style="position:absolute;top:10px;left:150px;height:400px;width:550px;"&gt; Read this useless nonsense I happen to like.
&lt;/DIV&gt; That will make a body of content ten pixels from the top, 150 pixels from the left, 400 pixels tall -at least-, and 550 pixels wide. If you put too much content it will expand to fit in most browsers. If you are not sure, you can leave out the height and it will simply size to fit.
You can change the numbers to whatever you like - even putting things on top of each other for whatever mad reasons drive you... :) you can give it a border: border: 2px black solid; or a background: background-color: #blue; background-image: url(my_bandwidth_hog.jpg); padding (space between it's edge and the content): padding:5px; and a lot of other more complicated stuff you can learn later. That's all you need to put the content anywhere on your page you want it, without any images or tables. If you lay it out top to bottom before the DIV tags like I suggested below, them those very old browsers, or strange text-only browsers will still see it in a very natural looking manner. If you want little bars and lines all over your screen try this trick: &lt;div style="position:absolute;background-color:red;font-color:red;top:76; left:150;width:600;height:4;font-size:1px"&gt;.&lt;/div&gt; Note that I make the font so small, and the background and font colors the same - that hides the little dot... You can put &amp;nbsp; instead of a dot. That's a space... That will let you draw all kinds of layout lines anywhere you want them, without any images or tables... put them as the very last thing in the HTML file, just before the closing &lt;/body&gt; tag... that way people with old browsers don't encounter any funny business.
DIV tags can also be used to do rollovers, you make two of them in same location, and have javascript to change which is visible. No images needed. If you want to do this, there are plenty of websites out there on the topic, many of which have cut and paste code to use to do it with. 
