寬度：100％部分屏幕？

我有一個難題：我需要在底部右側（在本地打開下面的代碼之後）看到的最暗灰色的條，跨越儘可能多的空間，因爲瀏覽器窗口將允許不經過我設置的淺灰色部分在左邊。這裏是我的代碼：寬度：100％部分屏幕？

<div class="timeline-section"> 
    <div class="timeline-wrapper"> 
     <div class="mini-timline"></div> 
     <div class="timeline"></div> 
     <div class="clearfix"></div> 
    </div> 
</div>

CSS：

.clearfix { clear: both; } 

.timeline-wrapper { position: relative; } 

.timeline-section { 
    background: #3d3d3d; 
    bottom: 0px; 
    height: 276px; 
    left: 0px; 
    width: 100%; 
    position: absolute; 
    padding: 0px;} 

.mini-timline { 
    background: #474747; 
    margin: 0px; 
    float: left; 
    height: 276px; 
    width: 500px; 
    display: inline-block;} 

.timeline { 
    background: #232323; 
    height: 200px; 
    width: 60%; 
    float: left; 
    display: inline-block; 
    position: relative;}

來源

2013-06-25 user2008567

你可以幫助人們通過添加一個小提琴... HTTP回答你的問題： //jsfiddle.net/D5Jxg/ ...進一步它是一個很好的沙箱，用於嘗試自己的代碼:) – conceptdeluxe

一種方法是不浮動timeline元素。
只需設置一個margin-left爲mini-timeline寬度：

.timeline { 
    background: #232323; 
    height: 200px; 
    margin-left:500px; 
    position: relative; 
    color:#FFF; 
}

http://jsfiddle.net/rLzAM/1/

來源

2013-06-25 23:10:20 showdev

-1

試試這個：

.timeline { 
    background: #232323; 
    height: 200px; 
    width: 100%; 
    display: inline-block; 
    position: absolute; 
}

來源

2013-06-25 23:12:20 TestShoot

哎呀，對不起showdev，我是多任務 – TestShoot

沒問題。然而，這似乎並沒有工作：http://jsfiddle.net/rLzAM/4/ – showdev

爲我工作，但當我去了bolden的變化，我得到了雙星號（S），所以如果你逐字逐句，它會失敗。否則罰款IE9和W7上的Chrome。 – TestShoot

寬度：100％部分屏幕？

回答

相關問題