Chad Z.
Chad Z.

Reputation: 13

HTML: Image wont go to top :(

I feel like this should be a super simple fix but it's driving me crazy. I am trying to get this image to rest up against the top of the browser window but I'm getting this padding above the image that I can't get rid of.

I've tried a few things like setting padding to 0 and I've tried deleting everything but the and I'm still getting the padding. Any help would be appreciated :)

http://twopairphoto.com/SlapFat/

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en">
<head>
  <style>

    body{
      padding-top: 0px;
    }       
    div {  
      padding-top: 0px;
    }    
  </style>
</head>
<body background="SlapFatBG_sm.jpg">
<div id="container" align="center"><img src="slapfatsplash_sm.jpg" /></div>
</body>
</html>

Thanks

Upvotes: 1

Views: 560

Answers (5)

Mike Christensen
Mike Christensen

Reputation: 91628

Try this:

body{
  padding-top: 0px;
  margin-top: 0px; //<---- Set body margin to 0px
}  

Confirmed with Firefox.

Upvotes: 0

CoffeeRain
CoffeeRain

Reputation: 4522

You could try absolute positioning...

div {position:absolute; top:0px;}

Upvotes: 0

Curtis
Curtis

Reputation: 103368

set margin to 0 also:

body {
      padding-top: 0px;
      margin:0;
} 

Upvotes: 1

Jordonias
Jordonias

Reputation: 5848

<body style="margin: 0px auto;">

or

body {
  padding-top: 0px;
  margin: 0px auto;
}

This will get rid of the margin on the top and bottom of the screen that is their by default. This will also center your content in most browsers as a result of setting the left and right margins to auto.

Upvotes: 0

Pavel Janicek
Pavel Janicek

Reputation: 14738

Try changing padding-top in the div to the margin-top

That should help

Upvotes: 0

Related Questions