對齊文本左側的文本中心和級別HTML

我已經在HTML中創建了一個項目符號列表。然後，我將文本和要點集中在一起。但是，一旦我將文本居中，我希望文本在左邊的一條直線上，所以我的項目符號點不會錯開。有什麼辦法可以做到這一點嗎？對齊文本左側的文本中心和級別HTML

我的CSS是休耕圍繞我的文字

.l-section.wpb_row.height_auto.color_alternate { 
     text-align:center; 
    }

圍繞我要點

.wpb_text_column p:last-child, .wpb_text_column ul:last-child, .wpb_text_column ol:last-child{ 
    list-style-position: inside; 
}

來源

2016-11-07 Craig Gallagher

添加文本對齊：中心於母公司併爲公告添加文本對齊：左 –

這被標記爲http://stackoverflow.com/questions/403的副本72065，但我重新打開它，因爲我不認爲它們是同一個問題。如果我錯了，請在評論鏈接這裏。 –

@JamesDonnelly我看到的唯一區別是被引用的文章有文本對齊，並且已經離開。 –

設置你的ul顯示爲inline-block以允許受影響由外部元素的text-align屬性，然後給它自己的text-align設置爲left對準內部列表項：

div { 
 
    text-align: center; 
 
} 
 

 
ul { 
 
    display: inline-block; 
 
    text-align: left; 
 
}

<div> 
 
    <ul> 
 
    <li>Foo</li> 
 
    <li>Bar</li> 
 
    <li>Foobar</li> 
 
    </ul> 
 
</div>

來源

2016-11-07 11:42:21

添加text-align: left;所顯示的公告列表。

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <style> 
 
    li { 
 
     text-align: left; 
 
    } 
 
    </style> 
 
</head> 
 
<body> 
 

 
<h4>An Unordered List:</h4> 
 
<ul> 
 
    <li>Coffee</li> 
 
    <li>Tea</li> 
 
    <li>Milk</li> 
 
</ul> 
 

 
</body> 
 
</html>

在你的UI元素和他的父親

來源

2016-11-07 11:42:23 Nitheesh

使用Flexbox的：

 .father { 
      display: flex; 
      flex-direction: row; 
      flex-wrap: nowrap; 
      justify-content: space-around; 
      align-content: flex-start; 
     } 
     ul{ 
      display: flex; 
      flex-direction: column; 
      flex-wrap: nowrap; 
      justify-content: space-around; 
      align-content: flex-start; 
     }

來源

2016-11-07 11:47:22 xale94

我認爲你可以做到這一點使用CSS Flexbox的財產。下面是我的代碼

HTML代碼

<h4>Heading</h4> 
<div class="container"> 
<ul> 
    <li>1st row</li> 
    <li>2nd row</li> 
    <li>3rd row</li> 
    <li>4th row</li> 
</ul>

CSS代碼

.container{display:flex; align-items:center;justify-content:center} 
h4{text-align:center;}

來源

2016-11-07 11:48:17 Niraj

對齊文本左側的文本中心和級別HTML

回答

相關問題