user3165952
user3165952

Reputation:

Css Black Bar Space

I have a really simple script.

Index.html

<!Doctype html>
<html>
    <title>Homepage</title>
    <head>
        <style>
            #topBlackBar {
                border-top: 50px solid #000;
            }
        </style>
    </head>
    <body>
        <div id="topBlackBar"/>
    </body>
</html>

I havent got the rest of the styling done for my page, but I do have a black top bar. The problem is that there's a little white space between the toolbar and the black top bar.

Here is an example

How could I change the script to remove the whitespace.

Upvotes: 2

Views: 8495

Answers (5)

nathanleachman
nathanleachman

Reputation: 285

Add this in your css

body{margin:0;padding:0;}

Upvotes: 1

riotgear
riotgear

Reputation: 555

You can also add #topBlackBar { border: 0px; padding: 0px; } so that your image doesn't have any extra space around it.

Upvotes: 0

Anima-t3d
Anima-t3d

Reputation: 3565

Reset your padding/margin that is default on the body element:

body{margin:0;padding:0;}

Upvotes: 1

Goose
Goose

Reputation: 3279

The body of a page generally has margins and/or padding assigned to it by default. You can fix this particular issue by adding this CSS style:

body {
    margin:0;
}

I would recommend adding a CSS reset to your page as well. Here is the one that I usually use, this will reset all of the default values so that your styling will actually appear as defined.

Upvotes: 5

n1kkou
n1kkou

Reputation: 3142

<div id="topBlackBar"/> should be: <div id="topBlackBar">content</div> p.s. Where is your script sample?

Upvotes: 0

Related Questions