Problem with CSS

zerocool posted this at 17:40 — 28th October 2009.

Joined: Jun 2009

Hey everyone,

I am new into css and i tried making my page from css and got stuck somewhere, i made a stylesheet with all the css and attached it to a page
the div named body i want it positioned to top -20px, but when i try to position the div named header to top 50px the div named body goes to 50 px too and also when i restore the browser to a small size the div id=body sticks to the right side i want it centered no matter what the size of the browser is. I cant really figure out what is it that i am doing wrong ... help me out i have pasted the html and the css for you below.
index.html:

<html>

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>CSS Website</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>

<body><div id="body" class="body" style="width: 1024px; height: 786px  ">
<div id="header" class="header" style="width: 800px">Yahoo!!</div></div>
</body>

</html>

Stylesheet:

body {
	background-image:url('grad2.png');
	background-repeat:repeat
}

.body {
	background-image: url('contentback1.gif');
	background-repeat: no-repeat;
	font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 0px;
	max-height: 786px;
	max-width: 1024px;
	margin-left: 100px;
	margin-top: 0px
}
      
.header {
    margin-top: 0px;
    margin-left: 110px;
    } 

webwiz posted this at 23:27 — 28th October 2009.

He has: 629 posts

Joined: May 2007

I really can't figure exactly what you are trying to do here, sorry. For example, why would you want to move the entire page contents 20px outside the top of the window?

Can you make a page with more than one word of content and put it on the Web for us to look at, please? Your snippet does not convey very much.

However, one major mistake you are making is using inline styles. Believe me, they will come back and bite you in the butt one day...

P.S. That's a decidedly odd font stack you are using.

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;

Megan posted this at 00:07 — 29th October 2009.

She has: 11,421 posts

Joined: Jun 1999

Also remember the difference between a class and an id. Id's are for unique items. You only have one header, so it should be referenced with an id, not a class (and most likely not both). For clarity, it would be good to call your containing div something like #container or #page or whatever, so it's not confused with the actual <body> tag.

To centre your body div you need to set the left & right margins to auto.

Otherwise it would be easier to help if you had a working link.

That font stack looks fine to me

Megan
Connect with us on Facebook!

zerocool posted this at 09:57 — 29th October 2009.

They have: 45 posts

Joined: Jun 2009

Thank you guys, although i figured it out, your comments help.
webwiz i have a design in mind that is why i moved it -20px top , and i am trying to create a page that is made entirely from css only and its my first time .

Thank you megan you are sweet .