Equivalent to <center> tag in CSS? [duplicate]

孤街浪徒 提交于 2019-11-30 22:32:27

问题


I read that the <center> tag is deprecated, however I cannot find any real equivalent to it in CSS. text-align works for text but not other elements, and auto margins only work if you know the width of the container (so not a solution if you don't know the width in advance). So is there any real equivalent to this <center> tag?


回答1:


text-align should work for other kinds of elements. Does this work?

.center { margin: auto; text-align: center; }

Edit Three Years Later :-D

"margin: auto;" also makes the top and bottom margins "auto". That might not be what you want. Alternatively you could have something like:

.center { margin-left: auto;
          margin-right: auto;
          margin-top: 3px;
          margin-bottom: 3px;
          text-align: center; }

This particular example will center the text horizontally while hardwiring the upper and lower margins to 3 pixels.

One can also say something like "margin: 3px auto 3px auto;" but I prefer spelling out the directions explicitly, as I can never quite remember what the order of the parameters are, if I put them all on the one "margin:" setting.




回答2:


There is a difference

    <center>
      <span> works </span>
    </center>

    <span style="margin: auto; text-align: center;"> And this is broken</span>

    <div style="margin: auto; text-align: center;"> but this works works</div>


来源:https://stackoverflow.com/questions/7226056/equivalent-to-center-tag-in-css

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!