2014-03-27 451 views
1

當我按下按鈕(+添加卡)時,創建div元素,就像卡片一樣。同時我滾動,覆蓋卡片。如下圖所示。我不想要這個。我怎樣才能避免這種情況? Demo Image滾動覆蓋HTML中的div元素

/*Style of a inbox list*/ 
#inboxList { 
    width: 275px; height: 700px; 
    background-color: #f0f0f0; 
    border: 1px solid black; 
    margin-left: 0.5%; 
    margin-top: 0.4%; 
    border-radius: 10px; 
    box-shadow: 7px 7px 7px #828282; 
    overflow: scroll; 
} 
+0

只是增加了寬度?或者我錯過了什麼? – George

+2

當您不希望滾動條設置爲「overflow:auto」時不滾動。 http://jsfiddle.net/NicoO/62QY8/55/ ...我沒有得到那些低估這些問題的人。有代碼演示甚至圖像。現在的問題並不太清楚,但我認爲有些人表現得有些苛刻 - –

+0

@NicoO Downvote是因爲OP顯然沒有表現出任何努力來解決他的問題,比如,試圖理解簡單的代碼他是使用。對我來說公平。 「我怎樣才能移除滾動條?」 「爲什麼地球上那麼你使用'溢出:滾動;'???等......而雅問題是相當不清楚的,我們不知道如果內容是最高的容器是什麼期望OP –

回答

2

要設置固定的高度,用min-height而是喜歡這裏:http://jsfiddle.net/62QY8/57/

,當然還有,刪除:overflow: scroll;

UPDATE:

DEMO jsFiddle

$('#AddCardBtn').click(function() { 
     var $newDiv = $div.clone(true); 
     cnt++; 
     $newDiv.prop("id", "div" + cnt); 
     var $userAddedCard = $('#userAddedCard'); 
     $userAddedCard.append($newDiv); 
     var testWidth = $userAddedCard.innerWidth() - $userAddedCard[0].scrollWidth; 
     if (testWidth) { 
      $userAddedCard.find('.sortable-div').width(260 + testWidth); 
     } 
    }); 
+0

也許我不清楚對不起,我仍然希望滾動,同時如果我添加了很多卡,在某些時候,卡將達到底部。然後,我想在CSS中使用「overflow:auto;」,並且仍然會用滾動條來覆蓋卡片。滾動發生時卡片是否縮小?您是否瞭解我? – AdiT

+1

您可以檢測水平滾動條和然後設置相關寬度,查看更新回答 –

+0

正是我需要的,非常感謝很多:) – AdiT

2

你可以做到這一點很容易只喜歡

#inboxList { 
    /* other styles */ 
    overflow: visible; 
} 
+0

或者只是刪除溢出:滾動。 – lsp

0

更改「#inboxList」的寬度的CSS顯示屬性更改爲350像素