divs - no space between?

yankeeschick

07-09-2008, 02:47 AM

I want to do 2 sections as separate divs one on top of the other, but I don't want any space between them. Can this be accomplished or will I have to make them in the same div?

rmedek

07-09-2008, 04:03 AM

Yes, it can.

yankeeschick

07-09-2008, 04:05 AM

ok... how? :) Whenever I create new divs it puts a space between them.

BoldUlysses

07-09-2008, 04:08 AM

Have you tried adding:

div {
margin:0px;
padding:0px;
border:0px;
}

to the top of your CSS?

jcdevelopment

07-09-2008, 04:19 AM

or better yet

* {
padding:0px;
margin:0px;
}

yankeeschick

07-09-2008, 04:22 AM

That doesn't seem to do anything :(

Here's what I'm trying to create:
http://yankees-chick.com/sample.gif

I was thinking that I should use 2 divs: 1 for the top box and then 1 right under it for the "notes" box. Ideas?

jcdevelopment

07-09-2008, 03:57 PM

well give us the look to what its doing, and some code.

rmedek

07-09-2008, 05:08 PM

div is an empty element. It, like span, has no semantic meaning whatsoever — and the only difference between div and span is that div is a block level element while span is an inline one. Because they are completely empty elements they aren't given any dimension, margin, or padding by the browser until you set it:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>divs are empty elements</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style type="text/css">
div {
width: 100px;
height: 100px;
border: solid 1px #000; }
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
</body>
</html>

…see? If you're getting spaces in between divs it means something inside the divs are pushing them apart, or you've applied styles to your divs and you need to alter them.

As far as how to make your little picture a webpage, start like you would any other (well-built) HTML-based website in the universe — mark up the HTML as semantically as you can, use extra markup as "hooks" if necessary, and then style with CSS. Without any HTML to style, CSS is useless.

VIPStephan

07-09-2008, 06:30 PM

And this is good to know, too: http://complexspiral.com/publications/uncollapsing-margins/