I'd like to make a layout for my site similar to the typical 3-column layouts you see on tons of Harry Potter websites. (like most of these) My site is not an HP-site but I'm trying to get the same kind of feel with it. Does anybody have experience doing those kinds of layouts? I've gotten a header about 700x125 done but I'm not sure what to go on to next.
That typical 3-column layout
do you have more problems with the design oder the code?
for valid 3 columns css designs see: ThreeColumnLayouts
for valid 3 columns css designs see: ThreeColumnLayouts
Organize your site like this:
<table border=0>
<tr>
<td>column1</td>
<td>column2</td>
<td>column3</td>
</tr>
</table>
Where columnX=your site's content
<table border=0>
<tr>
<td>column1</td>
<td>column2</td>
<td>column3</td>
</tr>
</table>
Where columnX=your site's content
| ocalhoun wrote: |
| Organize your site like this:
<table border=0> <tr> <td>column1</td> <td>column2</td> <td>column3</td> </tr> </table> |
boo
table layout has almost only disadvantages
Yeah, I think generally div layouts are probably better. I'm generally having some problems with the coding - my code often works for a while, then I refresh it without changing anything, and everything seems to pop out of place. I think the link you provided, ml, looks useful - thanks much!
One question, if anyone can answer: I'd like to have one background across the page, with my three columns of nav/content/random stuff centered on the page, changing depending on the monitor resolution. I was thinking of using something like this:
and then...
Is that a pretty stable method?
One question, if anyone can answer: I'd like to have one background across the page, with my three columns of nav/content/random stuff centered on the page, changing depending on the monitor resolution. I was thinking of using something like this:
| Code: |
| body { margin: 0px;
background: url('myimage.gif'); } .contentholder { align: center; width: 700px; background: url('mysecondaryimage.gif'); } .leftcol { margin-left: 5px; width: 150px; ETC ETC ETC } .content { margin-left: 160px; width: 380px; ETC ETC ETC } .rightcol { margin-left: 545px; width: 150px; ETC ETC ETC } |
and then...
| Code: |
| <div id="contentholder">
<div id="leftcol"> la la la </div> <div id="content"> la la la </div> <div id="rightcol"> la la la </div> </div> |
Is that a pretty stable method?
 |