CSS positioning: 3px problem
 

Hello everyone,

Since I've learned that tables should only be used for tabular data, I
am now trying to use CSS for the positioning of elements on my page.
But I've run into a small problem.

The problem is with this page:
http://wwwhome.cs.utwente.nl/~stolp/cpl/index.html.

In Mozilla Firebird, the two small boxes and the large one in the
middle line up perfectly, that is: the top of the boxes is at the same
height. However, in Internet Explorer (6) and Opera (7), the small
boxes are just a little lower than the large box.

Is this something I'll have to learn to live with because the browsers
differ too much, or is there something wrong with my code?

The CSS-code can be found at
http://wwwhome.cs.utwente.nl/~stolp/cpl/style.css.

Thanks in advance for any suggestions,

Daan Stolp

Re: CSS positioning: 3px problem
 

Daan wrote:

> In Mozilla Firebird, the two small boxes and the large one in the
> middle line up perfectly, that is: the top of the boxes is at the
> same height. However, in Internet Explorer (6) and Opera (7), the
> small boxes are just a little lower than the large box.

Depends on font-sizes etc.

> Is this something I'll have to learn to live with because the
> browsers differ too much, or is there something wrong with my
> code?

The top menu is placed in the same div as the middle contents. Due to
font-size variations etc. it may take up more space than expected,
pushing the other contents of the middle div down.

Place the top menu outside either of the three columns.

Example (probably needs some optimizing):

<http://www.daimi.au.dk/~zoolook/misc/campuslaan37/>

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/
"Angry men in combat fatigues talkin' to God on a two-way radio and
muttering incoherent slogans about freedom are eventually gonna
provide us with a great deal of entertainment." -- George Carlin

Re: CSS positioning: 3px problem
 

> Place the top menu outside either of the three columns.
>
> Example (probably needs some optimizing):
>
> <http://www.daimi.au.dk/~zoolook/misc/campuslaan37/>

Thanks a lot! That 'wrapper' element is just what I was looking for.

Daan

Re: CSS positioning: 3px problem
 

By the way, thanks for rewriting the rest of the page :-) I noticed
that you have replaced a lot of my div's with <h#> and <p> elements.
That's certainly an improvent where document structure is concerned,
but in my effort to work with positionable blocks, all I could think
was "div, div, div!".

Thanks again!
Daan