行內塊似乎不工作

我想在我的頁面上顯示一個簡單的塊佈局。只是幾個盒子，沒有什麼奇特的。這是我的代碼：行內塊似乎不工作

@section Content{ 

@model IEnumerable<webapp_stufv.Models.Article> 

<h2>@ViewBag.Title</h2> 

    @foreach (var item in Model) { 
     <div class="floating-box"> 
      <h4> 
       @Html.DisplayFor(modelItem => item.Title) 
      </h4> 
      <p> 
       @Html.ActionLink(@item.Content.Substring (0, 100), "Details", "News", new { id = item.Id }, null) 
      </p> 
     </div> 
    } 
}

這是我的CSS：

.floating-box { 
    display: inline-block; 
    width: 150px; 
    height: 75px; 
    margin: 10px; 
    border: 3px solid #73AD21; 
}

我真的不知道有什麼問題。我將添加結果的屏幕截圖。

我以前從來沒有使用過內嵌塊佈局，所以也許它很簡單。此代碼來自W3C，直接複製粘貼，所以它應該正常工作？

編輯：這應該是這樣的：https://jsfiddle.net/fha4oftm/ EDIT_2：我注意到在瀏覽器中檢查我的頁面時，浮動框不存在於我的.css文件中。這很奇怪，因爲它存在於我的項目的css文件中。

來源

2016-04-24 Kevin Strijbos

好像你的CSS不被引用的。你可以在Plunker上創建HTML源代碼演示來顯示問題嗎？ – navigator

請參閱[this fiddle]（https://jsfiddle.net/fha4oftm/）以瞭解如果應用css將會是什麼 –

我可以在plunker上創建MVC演示版嗎？樣式表正在我的_layout.cshtml頁面中引用。 –

嘗試添加以下到您的視圖頂部...

 <link rel="stylesheet" href="~/path/yourcssfile.css" />

來源

2016-04-24 10:49:32

行內塊似乎不工作

回答

相關問題