W3C home > Mailing lists > Public > www-style@w3.org > August 1998

Re: CSS positioning

From: Russell Pearson <R.Pearson@art.derby.ac.uk>
Date: Wed, 19 Aug 1998 13:40:38 +0100
To: www-style@w3.org
Message-ID: <l03130302b20078382438@[193.60.146.202]>
>Hi people !
>
>I'm trying to get something to work purely with CSS but it doesn't render in
>mybrowser (NN4.5) on Win 95...
>
>I've got a page where I want the layout to be such...
>
>--------------------------------------	|
>|link   text,text,text,text,text,text	|
>|link   text,text,text,text,text,text	|
>|link   text,text,text,text,text,text	|
>|                              		|
>|link   text,text,text,text,text,text	|
>|link   text,text,text,text,text,text	|
>|link   text,text,text,text,text,text	|
>|__________________________	|
>
>right now I have to use tables to have them side by side.... if I try not to
>use tables, it comes up like this :
>
>
>--------------------------------------	|
>|link  				|
>|link   				|
>|link  				|
>|        text,text,text,text,text,text	|
>|        text,text,text,text,text,text	|
>|        text,text,text,text,text,text	|
>|__________________________	|
>
>can anyone help me on how I can avoid using tables ??
>
>TIA
>Sandeep

Hi Sandeep,

I'm new to this list so I thought I'd begin my contribution by trying to
help out, before putting up my own layout problem.
If you create two sets of classes with different positions for the links on
the left and the text on the right, then the layout should be OK.
Here's an example:

	.leftlinks
	{
	font-family: 'Verdana', 'Arial ', 'Geneva ', 'Helvetica';
		font-size: 14pt;
		top: 110px;
		left: 100px;
	 	position: absolute;

   }

for the links, and


	{
		font-family: 'Verdana', 'Arial ', 'Geneva ', 'Helvetica';
		font-style: normal;
		font-weight: normal;
		font-size: 10pt;
		line-height: 15pt;
		color: #002131;
		left: 299px;
		top: 110px;
		width: 400px;
		text-align: left;
		padding: 1px 1px 1px 1px;
		position: absolute;
		}

For the text.

This has been adapted from some pages I'm using for IE4- I haven't tried it
out but it should work in principle, I hope!

Now I'm using this on a linked style sheet on http://art.derby.ac.uk/direct/
The problem I'm getting is with this .text  layout. Setting the line height
to 15pt makes the layout look nicer, but I'm getting misaligned lines, ie
some are layed out correctly but others are spaced too far apart. Any idea
how to cure this?

TIA!

Russ

Russell Pearson,
Media Delivery Specialist,
School of Art & Design,
University of Derby,
Britannia Mill,
Mackworth Road,
Derby.
DE22 3BL

R.Pearson@art.derby.ac.uk

www
Online Training: http://art.derby.ac.uk/direct/ (Work in Progress)
CyberForum:   http://art.derby.ac.uk/  (Previous Project)

Tel:01332 622222 x 4080
Fax:01332 622725
Received on Wednesday, 19 August 1998 08:38:55 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:53:55 GMT