CSS 100%高度无法正常工作

时间:2013-11-19 15:59:20

标签: css height

我对这个问题一无所知,我给你所有的CSS和HTML。 页面高于它应该的高度,高度不会因内容而改变。我知道下面的一些CSS是不可取的,但我会给他们更好的预览。

<html>
    <head>

    </head>
    <body>
    <div id="kapsayici">
        <div id="tepemenu">

        </div>
        <div id="baslik">
            <a href=#>
                <div class="baslik">
                    MUALLÄ°M
                </div>
            </a>
            <div id="slogan">
                &ldquo;Okumadan Okumuş Gibi Olmak İçin&bdquo;
            </div>
            <div class="sosyal">

            </div>              
        </div>
        <div id="icerik">
            <div id="menu">

            </div>
            <div id="slayt">

            </div>
            <div id="ortakisim">
                <div id="sol">
                </div>
                <div id="sag">
                </div>
                <div style="clear:both"></div>
            </div>
        </div>
    </div>
</body>

CSS:

   body{
width:auto;
background:url('http://images5.fanpop.com/image/photos/28300000/Libraries-Reading-Wallpapers-books-to-read-28317155-2560-1600.jpg');
background-attachment:fixed;
background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
}
div#kapsayici{
width:1000px;
margin-left:auto;
margin-right:auto;
border:solid;
}
div#tepemenu{
height:10px;
font-size:15px;
padding-top:5px;
padding-right:50px;
text-align:right;
}

div#baslik{
height:190px;
padding-top:20px;
padding-bottom:10px;
padding-left:60px;
}

.baslik{
float:left;
font-size:50px;
color:#4D3D26;
text-shadow:1px 1px 0 #FFF,1px -1px 0 #FFF,-1px -1px 0 #FFF,-1px 1px 0 #FFF;
font-family:'Trebuchet MS';
}

div#slogan{
width:100%;
min-height:20px;
text-align:center;
margin-left:210px;
margin-top:30px;
max-width:450px;
color:#FFF;
text-shadow:1px 1px 3px #4D3D26,1px -1px 3px #4D3D26,-1px -1px 3px #4D3D26,-1px 1px 3px #4D3D26;
font-family:verdana;
font-size:16px;
}
.sosyal{
float:right;
width:100%;
height:35px;
padding-right:55px;
max-width:250px;
text-align:right;
margin-top:-33px;
}


div#icerik{
width:100%;
background-color:rgba(0,0,0,0.7);
min-height:100px;
margin-top:-120px;
padding-top:10px;
height:100%;
}
div#slayt{
clear:both;
margin-left:10px;
margin-right:10px;
margin-top:0;
height:300px;
width:974px;
border:solid;
border-width:3px;
border-color:#FFF;
}
div#ortakisim{
width:980px;
margin-left:10px;
margin-right:10px;
margin-top:10px;
margin-bottom:10px;
height:100%;
}
div#sol{
float:left;
width:660px;
min-height:200px;
background:#F9F4E7;
}
div#sag{
width:300px;
margin-right:10px;
float:right;
position:relative;
min-height:200px;
background:#F9F4E7;
}

0 个答案:

没有答案