romain
romain

Reputation: 65

Unknown black area on my homepage

There is an horizontal scroll bar on my homepage only (http://balloonup.com) and a black border appears on the right? How is it possible? Thank you for you help

Upvotes: 0

Views: 284

Answers (5)

Udo G
Udo G

Reputation: 13141

The black "border" is actually the background of your page (#28292B, defined in stylehome.css for the HTML tag). Your problem is that the width of the <BODY> only depends on the window size, not on the content of the elements contained within. You can force the to the minimum width of the page using:

body { min-width: 930px; }

Alternatively, if you want IE6 / Opera 6 support (they don't support min-width) you need to add a dummy <DIV> to force the page width. You can use this as the very first <DIV> of your document:

<div style="position:absolute; top:0; left:0; width:930px; height:1px"></div>

However, there is another problem that stretches your content more than needed and this is caused by that questions counter on the right side. You can fix that by removing that "width" property from the .home_count rule as it's useless.

You may also revise that double .home_count .comma rule as this seems like an error to me.

Anyway, by applying those two modifications described above your page looks fine on FF4 whatever window size (except for the "Log in" button covering the phone number, but that's out of the scope of this question).

Upvotes: 1

clairesuzy
clairesuzy

Reputation: 27674

in oldcount.css

.home_count {
    display: block;
    margin: 0 auto;
    width: 420px;
}

remove the width

Upvotes: 1

blake305
blake305

Reputation: 2236

Here is the new solution. Add the inline style float:none to the highlighted element.

Screenshot

Upvotes: 2

Charlie
Charlie

Reputation: 11787

Try using this:

body{
margin-right:-50px;
}

Upvotes: -1

blake305
blake305

Reputation: 2236

In reset-fonts-grids.css, find all the instances of float:right and replace them with float:none.

Upvotes: -1

Related Questions