[Pmwiki-users] (:noleft:) layout questions

John Coxon ethel
Thu Dec 23 11:08:17 CST 2004


On Dec 22, 2004, at 1:10 PM, Hans Bracker wrote:

> If I float the left sidebar-column the main content
> will wrap around it. To avoid this I would need to make the left
> column artificially long. Is there a css way to make the main content
> appear in a rectangle so that it does not wrap? Or do I have to
> introduce a table with at least one cell to contain the content?

I was struggling just this week with a CSS only two column layout. I'm 
not sure if I'm interpreting your goals correctly but here's what I 
came up with:

.column1box
{
	background-color: transparent;
	text-align: right;
	float: left;
	width: 160px;
	height: auto;
	visibility: visible;
	display: block;
	padding: 7px;
	border-width: 0px 1px 0px 0px;
	border-style: none solid none none;
	margin: 30px 0px 0px 0px;
	text-transform: inherit;
}

.column2box
{
	background-color: #D5E9D5;
	text-align: left;
	width: auto;
	height: auto;
	visibility: visible;
	display: block;
	padding: 17px;
	position: relative;
	border-width: 2px 0px 0px 2px;
	border-style: solid none none solid;
	margin: 0 0 0 195px;

And the result: http://www.coxontool.com/collectanea/index.php

The content is still under construction but if you click through the 
navbar you can see how the two columns behave as the length of the 
content changes. Each navbar link is a field on my farm running 2.0b10

I'm running Mac OS X and haven't checked it on any windows browsers so 
I don't know how if behaves in the "real" world. It's consistent on 
Safari, Firefox, and IE for Mac.

John




More information about the pmwiki-users mailing list