2017-07-02 148 views
1

我正在使用語義UI框架。我正在嘗試創建類似於結構的後評論。目前我的代碼看起來是這樣的:保證金屬性不起作用

<!DOCTYPE html> 
<html> 
<head> 

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/1.11.8/semantic.min.css"/> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/1.11.8/semantic.min.js"></script> 

<title>Assignments</title> 
    <style> 
     .items { 
      width: 70%; 
      border: solid; 
      margin: 100px; 
     } 
    </style> 


</head> 
<body> 


<div class="ui items"> 
    <div class="item"> 
    <a class="ui tiny image"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="header">Jenny Hess</a> 
     <div class="metadata"> 
     <span class="date">Today at 5:42PM</span> 
     </div> 
     <div class="description"> 
     <p>First Post Ever In My Life</p> 
     </div> 
    </div> 
    </div> 
    <div class="ui comments"> 

    <div class="comment"> 
    <a class="avatar"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="author">Matt</a> 
     <div class="metadata"> 
     <span class="date">Today at 5:42PM</span> 
     </div> 
     <div class="text"> 
     How artistic! 
     </div> 
    </div> 
    </div> 
    <div class="comment"> 
    <a class="avatar"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="author">Elliot Fu</a> 
     <div class="metadata"> 
     <span class="date">Yesterday at 12:30AM</span> 
     </div> 
     <div class="text"> 
     <p>This has been very useful for my research. Thanks as well!</p> 
     </div> 
    </div> 
    </div> 
    <div class="comment"> 
    <a class="avatar"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="author">Joe Henderson</a> 
     <div class="metadata"> 
     <span class="date">5 days ago</span> 
     </div> 
     <div class="text"> 
     Dude, this is awesome. Thanks so much 
     </div> 
    </div> 
    </div> 
    <form class="ui reply form"> 
    <div class="field"> 
     <textarea rows="3" cols="50"></textarea> 
    </div> 
    <div class="ui blue labeled submit icon button"> 
     <i class="icon edit"></i> Add Reply 
    </div> 
    </form> 
</div> 
</div> 

<div class="ui items"> 
    <div class="item"> 
    <a class="ui tiny image"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="header">Jenny Hess</a> 
     <div class="metadata"> 
     <span class="date">Today at 5:42PM</span> 
     </div> 
     <div class="description"> 
     <p>First Post Ever In My Life</p> 
     </div> 
    </div> 
    </div> 
    <div class="ui comments"> 

    <div class="comment"> 
    <a class="avatar"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="author">Matt</a> 
     <div class="metadata"> 
     <span class="date">Today at 5:42PM</span> 
     </div> 
     <div class="text"> 
     How artistic! 
     </div> 
    </div> 
    </div> 
    <div class="comment"> 
    <a class="avatar"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="author">Elliot Fu</a> 
     <div class="metadata"> 
     <span class="date">Yesterday at 12:30AM</span> 
     </div> 
     <div class="text"> 
     <p>This has been very useful for my research. Thanks as well!</p> 
     </div> 
    </div> 
    </div> 
    <div class="comment"> 
    <a class="avatar"> 
     <img src="img_avatar3.png"> 
    </a> 
    <div class="content"> 
     <a class="author">Joe Henderson</a> 
     <div class="metadata"> 
     <span class="date">5 days ago</span> 
     </div> 
     <div class="text"> 
     Dude, this is awesome. Thanks so much 
     </div> 
    </div> 
    </div> 
    <form class="ui reply form"> 
    <div class="field"> 
     <textarea rows="3" cols="50"></textarea> 
    </div> 
    <div class="ui blue labeled submit icon button"> 
     <i class="icon edit"></i> Add Reply 
    </div> 
    </form> 
</div> 
</div> 
</body> 
</html> 

正如你可以看到我做了項目寬度的70%和利潤的汽車,但它沒有中心。有人可以建議我爲什麼?

回答

0

給出一個具體的ID這樣的項目的父,給

text-align: center; 

造型給它

讓我知道如果你需要更多幫助,

+0

都能跟得上。不起作用。它只關注項目的圖片而不是圖片和整個結構 – GeorgeTheGood

+0

如果您將id賦給包含所有這些元素的父div –