4 Replies - 6171 Views - Last Post: 28 January 2009 - 10:26 AM

#1 ericr2427  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 39
  • View blog
  • Posts: 378
  • Joined: 01-December 08

Vertical spacing with divs

Posted 28 January 2009 - 09:44 AM

I made a site in GIMP and cut it up, stuck all the images in a website, and it all worked out fine except for the div that the main content appears in, which has spacing on the top and bottom that I can't figure out how to remove.

HTML
<html>
<head>
<title>2427 Design - Website and Graphics Design</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="main">
<img src="Header.jpg">
<div id="navbar">
<img src="Home.png" style="float: left;">
<img src="AboutUs.png" style="float: left;">
<img src="Portfolio.png" style="float: left;">
<img src="ContactUs.png" style="float: left;">
</div>
<div id="content">
<?php
if (isset($_GET['page'])) {
  $page = $_GET['page'].'.php';
  if (file_exists($page)) {
	include ($page);
  }
  else {
	echo "page does not exist!";
  }
}
else {
  include ('home.php');
}
?>
</div>
<img src="Footer.jpg">
</div>
</body>
</html>



CSS
body {
text-align: center;
}

#main {
text-align: left;
margin: auto;
width: 800px;
height: 100%;
}

#navbar {
height: 50px;
width: 100%;
}

#content {
background: url('MainBg.jpg');
}



Sorry for the double post, the page did not appear to be working so I clicked the button again...

Is This A Good Question/Topic? 0
  • +

Replies To: Vertical spacing with divs

#2 thehat  Icon User is offline

  • awake ? web();
  • member icon

Reputation: 106
  • View blog
  • Posts: 951
  • Joined: 28-February 08

Re: Vertical spacing with divs

Posted 28 January 2009 - 09:56 AM

Take the height rule off the navbar, and add clear:both; to the content rules.
Was This Post Helpful? 0
  • +
  • -

#3 ericr2427  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 39
  • View blog
  • Posts: 378
  • Joined: 01-December 08

Re: Vertical spacing with divs

Posted 28 January 2009 - 10:00 AM

Worked for the first space, but not between the content and footer
Was This Post Helpful? 0
  • +
  • -

#4 thehat  Icon User is offline

  • awake ? web();
  • member icon

Reputation: 106
  • View blog
  • Posts: 951
  • Joined: 28-February 08

Re: Vertical spacing with divs

Posted 28 January 2009 - 10:20 AM

Aha! Ignore my previous suggestion, it was a bit of a dirty fix. I think it's your h1 tags in the content that're causing the issue. Try setting their margin and padding to 0.
Was This Post Helpful? 1
  • +
  • -

#5 ericr2427  Icon User is offline

  • D.I.C Regular
  • member icon

Reputation: 39
  • View blog
  • Posts: 378
  • Joined: 01-December 08

Re: Vertical spacing with divs

Posted 28 January 2009 - 10:26 AM

Thanks, that fixed it.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1