Question

无论屏幕大小如何，我都有一个菜单，我希望它完全位于徽标下面。直到屏幕变得足够小以用于移动设备，然后它变成汉堡包菜单。

对于居中文字，它可以正常工作：http://new2015.wingsofsupport.org/因此，当您使屏幕越来越大时，居中的文字将完全保留在徽标下方。

问题是我希望文本本身对齐，但仍保留在徽标下方。如果我做＆＃34; text-align：left;＆＃34;一旦我改变了屏幕尺寸，它就会很好地适应徽标，它会开始在整个地方移动。

我的Google-Fu让我失望以及我在Stack上找到的其他解决方案就像这样：Center UL but keep text left aligned并不能为我做这份工作。

Answer 1

你的意思是这样吗？

＆＃13;

/* Start Praveen's Reset for Fiddle ;) */
* {font-family: 'Segoe UI'; margin: 0; padding: 0; list-style: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
/* End Praveen's Reset for Fiddle ;) */
ul {display: block; width: 100px; border: 1px solid #ccc; margin: auto;}

＆＃13;

<ul>
  <li><a href="#">Item 1</a></li>
  <li><a href="#">Item 2</a></li>
  <li><a href="#">Item 3</a></li>
  <li><a href="#">Item 4</a></li>
  <li><a href="#">Item 5</a></li>
</ul>

＆＃13;

Bootstrap3将文本左对齐但保持文本块居中

1 个答案: