Unerwünschter Rand / Lücke auf der linken Seite der gesamten Webseite

Question

May 15, 2013, 03:14 PM

Unerwünschter Rand / Lücke auf der linken Seite der gesamten Webseite

Ich habe gerade angefangen, eine Site zu erstellen, und ich habe einen Rand von ein paar Pixeln auf der gesamten linken Seite und kann nicht herausfinden, warum.

http://jsbin.com/elufob/1/

Jeder Rat wäre sehr dankbar

CSS

    html{
    min-width: 100%;
    background-color: #add8e6;
}

.navBar{
    text-align: center;
    background-image: linear-gradient(to bottom, #666666 0%, #000000 60%);
    color: white;
    border-bottom:solid 1px #666;
    top:0;
    height:30px;
    position:fixed;
    width:100%;
    z-index:1000;
}

.leftDiv{
    clear: left;
    text-align: left;
    background-color: blue;
    float: left;
    max-width: 26%;
    display: inline-block;
    margin-right:2%;
    margin-left: 0%;
    margin-top: 2%;
    border: black;
    border-width: 5px;
    border-style: double;
    border-radius: 5px;
}

.middleDiv{
    text-align: center;
    background-color: green;
    max-width: 70%;
    float: right;
    display: inline-block;
    margin-top: 2%;
    MARGIN-BOTTOM: 1%;
    border-style: solid;
    border: black;
    border-width: 5px;
    border-style: double;
    border-radius: 5px;
}

.pageContainer{
    width: 100%;
    min-height: 100%;
    min-width: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -142px;
}

.footer{
    background-image: linear-gradient(to bottom, #666666 0%, #000000 60%);
    color: white;
    border-top:solid 1px #666;
    bottom:0;
    height:15px;
    padding:5px;
    position:fixed;
    width:100%;
    z-index:1000;
}

Und das HTML

<html>
<link rel="stylesheet" href="psWebCss">

<header class=navBar>
    <a href="http://www.google.com"><img src="http://library.thinkquest.org/10127/media/examples/Button.gif"></a>
    <a href="http://www.google.com"><img src="http://library.thinkquest.org/10127/media/examples/Button.gif"></a>
    <a href="http://www.google.com"><img src="http://library.thinkquest.org/10127/media/examples/Button.gif"></a>
    <a href="http://www.google.com"><img src="http://library.thinkquest.org/10127/media/examples/Button.gif"></a>


</header>    
<body>
<div class="pageContainer">    
    <div class="leftDiv">          
    </div>   
    <div class="middleDiv"> 
    </div>
</div>
<div class="footer">
   Footer Text
</div>
</body>





</html>