honeybadger
New Member
Guys this is my first time playing around with HTML/CSS and I am trying to make a simple page with pictures on it.
It loads perfectly, just where I want it. But to the right and underneath the pictures are HUGE scroll bars full of empty space.
Why did I get that?
here is my code:
It loads perfectly, just where I want it. But to the right and underneath the pictures are HUGE scroll bars full of empty space.
Why did I get that?
here is my code:
HTML:
<html>
<head><TITLE>This is the Title</TITLE></head>
<style type="text/css">
body {
text-align: center;
}
#container {
margin: 0 auto;
width: 1024px;
}
#toppage {
position: relative;
top: 0px;
left: 0px;
}
#picture {
top: 30px;
left: 0px;
position: relative;
}
#nextpicture {
top: -383px;
left: 44px;
position: relative;
}
#thirdtpicture {
top: -678px;
left: 742px;
position: relative;
}
#fourthpicture {
top: -870px;
left: 758px;
position: relative;
}
</style>
<div id="container">
<body bgcolor="white">
<div id='toppage'><p align="center"><img src="headerpicture"</p></div>
<div id='picture'><p align="center"><img src="picture1"/></p></div>
<div id='nextpicture'><p><img src="picture2"/></p></div>
<div id='thirdpicture'><p><img src="picture3"/></p></div>
<div id='fourthpicture'><p><img src="picture4"/></p></div>
</body>
</div>
</html>