100 % 높이 포장지, 부유도가있는 어린이가 부러지기

나는 여기에서 무슨 일이 일어나는지 알지 못합니다. 나는 모든 온라인 픽스를 온라인으로 시도했는데 찾을 수 있었고 아무 것도 작동하지 못했습니다.100 % 높이 포장지, 부유도가있는 어린이가 부러지기

퍼팅 클리어는 작동하지 않으며 사용자 오버플로 : auto를 사용할 수 없습니다. 래퍼에서 내비게이션 위치를 지정하기 때문입니다. 아래

코드 정말 여기에 몇 가지 도움말을 사용할 수 있습니다 여기에 무엇이 잘못의 예입니다.

@CHARSET "ISO-8859-1"; 
* {margin:0;padding:0;} 
html, body 
{ 
background-color: #dcdcdc; 
padding: 0px; 
margin: 0px; 
height: 100%; 
font-family: Tahoma, Arial; 
} 

#wrapper 
{ 
border-top: 1px white solid; 
width: 1100px; 
min-height: 100%; 
margin: auto; 
background-color: #fff; 

} 

#headerBlue 
{ 
width: 1086px; 
height: 110px; 
margin: auto; 
margin-top: 7px; 
background-image: url('http://plustg.com/v2/_img/blue/header.png'); 
background-repeat: no-repeat; 
} 

#headerPink 
{ 
width: 1086px; 
height: 110px; 
margin: auto; 
margin-top: 7px; 
background-image: url('http://plustg.com/v2/_img/pink/header.png'); 
background-repeat: no-repeat; 
} 

#userStuff 
{ 
float: left; 
width: 216px; 
height: 88px; 
margin-top: 10px; 
margin-left: 350px; 
padding: 5px; 
} 

#userStuff img 
{ 
float: left; 
} 

#welcomeMessage 
{ 
float: left; 
font-size: 11px; 
color: #fff; 
display: block; 
margin-left: 10px; 
margin-top: 5px; 
} 

#notificationBar 
{ 
float: left; 
display: block; 
width: 129px; 
height: 23px; 
font-size: 11px; 
color: #fff; 
background-image: url('http://plustg.com/v2/_img/notification.png'); 
background-repeat: no-repeat; 
margin-top: 10px; 
margin-left: 10px; 
padding-left: 5px; 
padding-top: 3px; 
} 

#logo 
{ 
width: 115px; 
height: 39px; 
float: right; 
margin-top: 20px; 
margin-right: 40px; 
} 

#leftBar 
{ 
margin-top: 10px; 
width: 160px; 
float: left; 
} 

#navMain 
{ 
width: 140px; 
} 

#mainBlue 
{ 
width: 150px; 
height: 37px; 
background-image: url('http://plustg.com/v2/_img/blue/navMain.png'); 
background-repeat: no-repeat; 
font-size: 12px; 
color: #fff; 
margin-left: -11px; 
} 

#mainPink 
{ 
width: 150px; 
height: 37px; 
background-image: url('http://plustg.com/v2/_img/pink/navMain.png'); 
background-repeat: no-repeat; 
font-size: 12px; 
color: #fff; 
margin-left: -11px; 
} 

span.mainTitle 
{ 
display: block; 
float: left; 
margin-left: 22px; 
margin-top: 4px; 
} 

#navMain ul, #navMain li 
{ 
list-style: none; 
padding: 0; 
margin: 0; 
} 

#navMain ul 
{ 
padding-left: 10px; 
margin-top: -5px; 
} 

#navMain li 
{ 
font-size: 14px; 
color: #1385a9; 
padding-top: 3px; 
border-bottom: 1px dotted #1385a9; 
} 

#navMain a 
{ 
font-size: 13px; 
color: #424141; 
text-decoration: none; 
} 

#content 
{ 
width: 660px; 
height: auto; 
float: left; 
margin-top: 25px; 
margin-left: 20px; 
} 

#newsLatest 
{ 
width: 654px; 
height: 157px; 
background-image: url('http://plustg.com/v2/_img/newsbg.png'); 
background-repeat: no-repeat; 
} 

img.newsImg 
{ 
float: left; 
} 

.titleBit 
{ 
float: left; 
margin-left: 10px; 
margin-top: 10px; 
font-size: 12px; 
color: #535455; 
width: 400px; 
} 

.newsCat 
{ 
color: #e96125; 
} 

.byBit 
{ 
float: left; 
margin-left: 16px; 
font-size: 11px; 
color: #8d8e8f; 
} 

a.author 
{ 
color: #2e821a; 
} 

span.comments 
{ 
background-image: url('http://plustg.com/v2/_img/balloon-left.png'); 
background-repeat: no-repeat;; 
padding-left: 20px; 
} 

span.comments a 
{ 
color: #000; 
} 

.newsBit 
{ 
float: left; 
width: 390px; 
height: 70px; 
font-size: 11px; 
color: #535455; 
margin-left: 16px; 
margin-top: 13px; 
} 

.buttonBit 
{ 
float: left; 
width: 400px; 
margin-left: 16px; 
margin-top: 10px; 
} 

.newsMore 
{ 
color: #fff; 
display: block; 
font-size: 11px; 
background-image: url('http://plustg.com/v2/_img/newsButton.png'); 
background-repeat: no-repeat; 
width: 112px; 
height: 20px; 
padding-top: 3px; 
padding-left: 10px; 
float: right; 
} 

.newsMore a 
{ 
color: #fff; 
text-decoration: none; 
} 

#tmLatest 
{ 
width: 660px; 
margin: auto; 
margin-top: 15px; 
} 

#tmLatest img 
{ 
width: 655px; 
margin: auto; 
cursor: pointer; 
} 

.switchLatest 
{ 
height: 25px; 
font-size: 12px; 
color: #e97a49; 
padding-right: 5px; 
} 

.switchLatest a 
{ 
display: block; 
float: right; 
text-align: center; 
width: 17px; 
height: 17px; 
border: 1px solid #e97a49; 
margin-top: 3px; 
margin-left: 5px; 
color: #e97a49; 
text-decoration: none; 
} 

.switchLatest a:hover 
{ 
background-color: #e97a49; 
color: #fff; 
} 

#forumStats 
{ 
width: 388px; 
float: left; 
height: 50px; 
} 

.forumBar 
{ 
height: 23px; 
background-image: url('http://plustg.com/v2/_img/barGreen.png'); 
background-repeat: no-repeat; 
font-size: 12px; 
color: #fff; 
padding-left: 10px; 
padding-top: 3px; 
} 

#selfyLatest 
{ 
width: 248px; 
float: right; 
height: 50px; 
} 

.selfyBar 
{ 
height: 23px; 
background-image: url('http://plustg.com/v2/_img/barRed.png'); 
background-repeat: no-repeat; 
font-size: 12px; 
color: #fff; 
padding-left: 10px; 
padding-top: 3px; 
} 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>PlusTG Design v2</title> 
<link href="_inc/_css/v1.css" title="compact" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<div id="wrapper"> 
<div id="headerBlue"> 
    <div id="userStuff"> 
    <img src="http://plustg.com/v2/_img/defaultAvatar.png" alt="defaultAvatar" /> 
    <span id="welcomeMessage">Welcome <strong>Collussus</strong></span> 
    <span id="notificationBar"><strong>1</strong> new notification</span> 
    </div> 
    <div id="logo"><img src="http://plustg.com/v2/_img/logo.png" alt="Logo" /></div> 
</div> 
<div id="leftBar"> 
    <div id="navMain"> 
    <div id="mainBlue"> 
    <span class="mainTitle"><strong>Main Menu</strong></span> 
    </div> 
    <ul class="blue"> 
    <li>&raquo; <a href="#">Home</a></li> 
    <li>&raquo; <a href="#">Selfy Maker</a></li> 
    <li>&raquo; <a href="#">Profiles</a></li> 
    <li>&raquo; <a href="#">Bookmarklets</a></li> 
    <li>&raquo; <a href="#">Advertise Us</a></li> 
    <li>&raquo; <a href="#">Contact</a></li> 
    </ul> 
    </div> 

</div> 

<div id="content"> 
    <div id="newsLatest"> 
    <img src="http://plustg.com/v2/_img/newsTestImg.png" alt="test" class="newsImg" /> 
    <div class="titleBit">&#147;<strong>[01/29/2011]</strong> <span class="newsCat">Maintenance</span>: And we're back!&#148;</div> 
    <div class="byBit">By <a href="#" class="author">Collussus</a> <span class="comments"><a href="#">51</a></span></div> 
    <div class="newsBit">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec ante sapien, eget convallis ligula. Ut consectetur risus ac purus ullamcorper non varius enim pulvinar. Etiam tristique urna sed mauris porttitor iaculis. Phasellus dui nisi, vehicula id laoreet ut, tristique in dui. In et euismod massa. Morbi pharetra sagittis dui. </div> 
    <div class="buttonBit"><span class="newsMore"><a href="#">Read More &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &raquo;</a></span></div> 
    </div> 
    <div id="tmLatest"> 
    <img src="http://img.tinierme.com/shop_gacha/gacha/2011/01/img/20110128_time/110128_time_title.jpg" alt="Gears of Time" /> 
    <div class="switchLatest"><a href="#">5</a><a href="#">4</a><a href="#">3</a><a href="#">2</a><a href="#">1</a></div> 
    </div> 

    <div id="forumStats"> 
    <div class="forumBar"><strong>Latest Forum Activity</strong></div> 
    <div class="forumContent"> 
    <div class="onePost"> 
    <img src="http://plustg.com/v2/_img/defaultAvatarS.png" /> 
    tests 
    </div> 

    </div> 
    </div> 
    <div id="selfyLatest"> 
    <div class="selfyBar"><strong>Latest Saved Selfy</strong></div> 
    <div class="selfyContent">stuff here<br />test</div> 
    </div> 

</div> 
</div> 

</body> 
</html>

출처

2011-01-30 Dave Siegel

"자식"의 복수는 "자식"입니다. (나는 당신의 제목을 고쳤습니다.) –

ty, 아직 많이 도움이되지 않지만> _> –

나는 귀하의 문제를 이해하고 있습니다. 흰색 바탕에 #wrapper이 페이지 맨 아래로 내려 오지 않았습니까?

는이 경우 :

그냥 #wrapper에 대한 닫는 태그 전에 추가 <br style="clear: both" />.
#forumStats에서 height: 50px을 제거하고 overflow: auto을 추가하십시오.

Firefox에서 수정되었습니다.

출처

2011-01-30 17:14:15 thirtydot

나는 그것을 보지 못했다고는 믿을 수 없습니다. 고마워. 높이가 너무 작 았던 인물. –

100 % 높이 포장지, 부유도가있는 어린이가 부러지기

답변

관련 문제