!@@!

Introduction: Having problems coding your layout? Like you can make a great layout in photoshop, but can't get it to work for your site? This section is to help all those peoples that have those problems. Follow these steps and you'll know too.

Please note: All the html tags have a * in them so that it doesn't actually do the tag. Remove all the * from the tags.

First off, you have to know html. Sorry to all you page-maker peoples, but html is the best way to make your site. Once you learn it you can run your site much easier.

Now, do everything as you would normally do up until you get to <*/head> and start <*body> (Remember, remove the *). If your layout has a scroller (those little arrows which go up/down when you put your mouse on them) then you don't need to put a body background, but if you don't, put a body background with the background you need for your site (like if you have vertical lines that go down until the bottom of the page). So your body tag should be like this: <*body background="bg2.jpg" leftmargin="0" topmargin="0"*>. Again, the background is only if you don't have a scroller.

Next, put <*img src="layout.jpg"> under the background tag. "layout.jpg" is your layout in one big image, that's how most webmasters make their layouts nowadays. You should cut out separators and things you want to rotate/have to move. Save your document and check out what you've got. You should have your layout perfectly aligned and everything, minus the text and separators.

This is the "hard" part. It's not really hard, but without experience it can be long. Under the image tag you put: <*div style="position: absolute; top: 60; left: 205; width: 320;">. The numbers I put for top, left and width are all examples, they change depending on where you want to put your things. You see, the div tag places your text/image/whatever you want, wherever you want on your layout. The numbers are in pixels, for those who aren't familiar with pixels, 100 pixels is fairly small. A layout's usual width is 780 pixels. So what you do is you estimate how many pixels you need from the top to your text/image and how many pixels you need from the left of your layout to your text/image. It's all about trial and error. The width is optional, it's like a table's width (an html table, I mean). I probably lost you right there, but if you are using the div for a news box, you'll want width so the text doesn't keep on going into your nav bars lol.

Here's an example of a div.

<*div style="position: absolute; top: 235; left: 5;">
<*a href="somelink.html">Something<*/a><*br>
<*a href="somelink.html">Something<*/a><*br>
<*a href="somelink.html">Something<*/a><*br>
<*a href="somelink.html">Something<*/a><*br>
<*/div>

So now make as many divs as you want to align all of your text/extra images into your layout. Using divs is much more organized then tables and it's less complicated, but there is a lot of trial and error involved at first. Once you get used to it your estimations are more precise and you get the work done faster.

INSTANT TRANSMISSION