Jump to content

Divs & Aligninment


bbr

Recommended Posts

Tables i can manage, http://blogtestlayout.blogspot.com/The border pixel is a temporary solution.Divs however, completely freak me out.I've tried aligning the dives as you can see above, but without the table the bars on the right side go "under" the main header.I can't for the life of me figure out how to move the silly things to the top of the page without forcing them there with a table.I'm probably just looking at the issue wrong, but perhaps somebody here has an insight that i'm missing.Also the "left" sidebar, moves itself to the right. and the "right" sidebar keeps moving itself to the left.... go figure.These things are cute in tandem with CSS, but without tables, i just can't seem to get them to stick where they should be.

<body>  <div id='outer-wrapper'>	<table align='center' border='1' cellpadding='0' cellspacing='0'>		<tr valign='top'>			<td valign='top'>				  <div id='header-wrapper'>					<b:section class='header' id='header' maxwidgets='1'><b:widget id='Header1' locked='true' title='Experimental (Header)' type='Header'/></b:section>				  </div>							  <div id='crosscol-wrapper' style='text-align:center'>					<b:section class='crosscol' id='crosscol' showaddelement='no'/>				  </div>								  <div id='main-wrap1'>					  <div id='main-wrap2'>						<b:section class='main' id='main' showaddelement='no'><b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/></b:section>					  </div>				  </div>			</td>			<td valign='top'>				  <div id='leftsidebar-wrap'>					<div id='sidebar1-wrap'>						<div id='sidebar1-wrap2'>							<b:section class='sidebar' id='sidebartop'><b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/></b:section>						</div>					</div>									<div id='sidebarbottom1-wrap1'>						<div id='sidebarbottom1-wrap2'>							<b:section class='sidebar' id='sidebar' preferred='yes'><b:widget id='LinkList1' locked='false' title='links' type='LinkList'/></b:section>						</div>					</div>				  </div>								  <div id='rightsidebar-wrap'>					<div id='sidebar2-wrap'>						<div id='sidebar2-wrap2'>							<b:section class='sidebar' id='sidebartop2'><b:widget id='TextList1' locked='false' title='list' type='TextList'/></b:section>						</div>					</div>									<div id='sidebarbottom2-wrap1'>						<div id='sidebarbottom2-wrap2'>							<b:section class='sidebar' id='sidebar2' preferred='yes'><b:widget id='HTML3' locked='false' title='test' type='HTML'/></b:section>						</div>					</div>				  </div>			</td>		</tr>	</table>  <div id='footer-wrap1'>	  <div id='footer-wrap2'>		<b:section class='footer' id='footer'><b:widget id='HTML2' locked='false' title='test test test' type='HTML'/></b:section>	  </div>  </div></div></body>

This is what it's like now.

Link to comment
Share on other sites

Here's two examples, that (if combined) may help (if I understand correctly what u r trying 2 do, I'm not very good at table based layouts):http://www.htmldog.com/examples/pagelayout4.htmlhttp://www.htmldog.com/examples/pagelayout7.htmlNote: A nice trick to give the navigation bars a background color is by giving the content panel left and right borders with the same width as the navigation bars.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...