div上的滚动条

我尝试显示滚动条时出现css问题。当需要滚动条时，我希望宽度适应。现在，如果因为内容不够长而没有滚动条，那么就会有一个丑陋的空白空间。div上的滚动条

这的jsfiddle将给予什么，我试图描述一个更好的主意：

<div id="wiselinks_content" class="containers message_content" style="max-height: 500px;"> 
<div style="padding:20px; float:left;"> 
    <div style="float:left; width: 100%; margin-bottom:10px" class="message_box message_box_18"> 
     <div style="float:left; height: 40px; width: 40px; margin-right: 6px"> <a href="/thibault"><img alt="Profile_304577200_75sq_1373018073" height="40" src="http://images.ak.instagram.com/profiles/profile_304577200_75sq_1373018073.jpg" style="display:block;" width="40"> 
     </a> 
     </div> 
     <div style="float:left;width: 88%;"> <b> <a href="/thibault">Thibault B</a> </b><span style="color:#999; font-size: 11px"> about 1 month ago</span><br>hello 
      <br> 
     </div> 
    </div> 
    <div style="float:left; width: 100%; margin-bottom:10px" class="message_box message_box_19"> 
     <div style="float:left; height: 40px; width: 40px; margin-right: 6px"> <a href="#"><img alt="Profile_304577200_75sq_1373018073" height="40" src="http://images.ak.instagram.com/profiles/profile_304577200_75sq_1373018073.jpg" style="display:block;" width="40"> 
</a> 

     </div> 
     <div style="float:left;width: 88%;"> <b> <a href="#">Thibault B</a> </b><span style="color:#999; font-size: 11px">about 1 month ago</span><br>how are you 
      <br> 
     </div> 
    </div> 
    <div style="float:left; width: 100%; margin-bottom:10px" class="message_box message_box_28"> 
     <div style="float:left; height: 40px; width: 40px; margin-right: 6px"> <a href="#"><img alt="Picture?type=large" height="40" src="http://graph.facebook.com/100001498571059/picture?type=large" style="display:block;" width="40"> 
</a> 

     </div> 
     <div style="float:left;width: 88%;"> <b> <a href="/marunbai">Runbai M</a> </b><span style="color:#999; font-size: 11px">28 days ago</span><br>look at this<br><br> 
     </div> 
    </div> 
</div> 
<div class="create_message"> 
    <form accept-charset="UTF-8" action="/messages/create" class="simple_form new_message" enctype="multipart/form-data" id="new_message" method="post"> 
     <div style="margin:0;padding:0;display:inline"> 
      <input name="utf8" type="hidden" value="✓"> 
      <input name="authenticity_token" type="hidden" value="k32vPIjud4khEnj6U3Bxcx1bVXrRcDpS8dO9S/8K1Uw="> 
     </div> 
     <input id="message_recipient_id" name="message[recipient_id]" type="hidden" value="12"> 
     <input id="message_type" name="message[type]" type="hidden" value="reply"> 
     <input id="message_sender_id" name="message[sender_id]" type="hidden" value="1"> 
     <textarea cols="40" id="message_body" name="message[body]" rows="20"></textarea> 
     <input id="message_subject" name="message[subject]" type="hidden" value=""> 
     <output id="pic_preview"></output> 
     <div class="options"> 
      <label class="filebutton"> 
       <img src="/assets/photo_logo.png" height="20px" width="20px"> <span> 
       <input id="picture_for_message" name="message[picture]" type="file"> 
      </span> 

      </label> 
      <input class="button create_message_button" name="commit" type="submit" value="Send"> 
     </div> 
    </form> 
</div>

在此先感谢

来源

2013-12-13 titibouboul

你指的是哪个白色空间？指定确切的位置。 –

使用

html { 
    overflow-y: scroll; 
}

，你会总是有一个滚动条，无论页面高度为

来源

2013-12-13 17:04:57 TimPalmer

div上的滚动条

回答

相关问题