Site should start at top but doesn't

SuperSriver

07-28-2011, 12:15 AM

Hi there,
in the very early stage of designing a site I have tested the existing code in several browser to avoid late and nasty surprises, but there is already one:

The top element should start at the very top of the page (No border, padding, margin or whatever kind of space). In IE it does, which is fine, in ALL other browsers i t doesn't :there is a black space on top of the top element which I can't get rid of.
I am used to the situation that all broesers work fine and IE is messing up, but here it seems to be the other way round.

What have I coded incorrectly? Can anybody help to stick the page to to top edge of the browser? I am grateful for any comments.

It looks like this:

http://www.learn-german-thoroughly.de/newsite.php

The css is attached. It is very simple; nearly naked, but already causing problems. Please help if you can.

Thanks a lot!

Sammy12

07-28-2011, 12:19 AM

take display: inline-block out from * on line 4 of css

SuperSriver

07-28-2011, 12:31 AM

Wow, that was not only a quick response - it was also a very good one!
Thanks!
Have just tried it, and now it looks as it should in all browsers. Brilliant.

Could you also give me a quick hint why this is the case; I (being beginner) don't fully understand it. That would be splendid!

Anyway, thanks a lot for the help :)

Sammy12

07-28-2011, 12:38 AM

because * is setting to all elements, including the <head>, therefore you set the <head> to display: inline-block. Now it has a height on your page. You don't need inline-block to all elements and I would actually advice you to not use it in the future, since I believe the browser support is not safe to use it freely

SuperSriver

07-28-2011, 12:45 AM

Very good point; I wasn't aware that * includes the header as well and was therefore stupidly wondering what this 'something' at the top might be.... now I know.
Thanks again; I'll see if I can proceed without display: inline block.
Good night.

Sammy12

07-28-2011, 12:57 AM

forgot to post this in my previous post :D

<head> is by default display: none;, changing it to inline-block gives it a space on the page

http://i1114.photobucket.com/albums/k535/auroralight1/Untitled-42.png

Lerura

07-28-2011, 01:11 AM