Twitter Bootstrap佈局寬度隱藏元素

我正在處理aspnet應用程序和twitter引導程序。我有一種情況，我需要隱藏基於變量女巫我可以正確做一個跨度。問題是隱藏的跨度保持寬度並打破下一個div。Twitter Bootstrap佈局寬度隱藏元素

<div class="row-fluid"> 
     <div class='<%= (showTitle ? "span4" : "hide") %>'> 
      <label>Title</label> 
      <ASP:DropDownList ID="DpdLstTitle" runat="server" CssClass="span12"></ASP:DropDownList> 
     </div> 
     <div class='<%= (showTitle ? "span8" : "span12") %>'> 
      <label>Name</label> 
      <ASP:TextBox ID="TboxName" runat="server" MaxLength="80" CssClass="span12" /> 
     </div> 
    </div>

有什麼建議嗎？

來源

2013-05-20 Sandcar

如果你使用{顯示：無;}而不是{能見度：隱藏;}？ – JonWells

您是否覆蓋CSS中的'.hide'類？默認情況下，Bootstrap將這個類設置爲'display：none;'，它將渲染樹中的元素完全刪除，所以它不應該佔用任何空間。 – jmeas

你將不得不在一些CSS添加爲引導增添了緣至第二排

大概：

margin-left: 2.127659574468085%;

所以你必須覆蓋它。插入

margin-left: 0;

示例HTML：

<div class="row-fluid"> 
    <div class='<%= (showTitle ? "span4" : "hide") %>'> 
     <label>Title</label> 
     <ASP:DropDownList ID="DpdLstTitle" runat="server" CssClass="span12"></ASP:DropDownList> 
    </div> 
    <div class='<%= (showTitle ? "span8" : "span12 hiddenColBefore") %>'> 
     <label>Name</label> 
     <ASP:TextBox ID="TboxName" runat="server" MaxLength="80" CssClass="span12" /> 
    </div> 
</div>

範例CSS：

.hiddenColBefore { 
    margin-left: 0 !important; 
}

來源

2013-05-20 11:55:11 slinky2000

非常感謝！有用：）。我只需要！對於CSS來說很重要。 Chears – Sandcar

完美。樂意效勞。 – slinky2000

Twitter Bootstrap佈局寬度隱藏元素

回答

相關問題