css – HTML span align center not working?

css – HTML span align center not working?

A div is a block element, and will span the width of the container unless a width is set. A span is an inline element, and will have the width of the text inside it. Currently, you are trying to set align as a CSS property. Align is an attribute.

<span align=center style=border:1px solid red;>
    This is some text in a div element!
</span>

However, the align attribute is deprecated. You should use the CSS text-align property on the container.

<div style=text-align: center;>
    <span style=border:1px solid red;>
        This is some text in a div element!
    </span>
</div>

Please use the following style. margin:auto normally used to center align the content. display:table is needed for span element

<span style=margin:auto; display:table; border:1px solid red;>
    This is some text in a div element!
</span>

css – HTML span align center not working?

The align attribute is deprecated. Use CSS text-align instead. Also, the span will not center the text unless you use display:block or display:inline-block and set a value for the width, but then it will behave the same as a div (block element).

Can you post an example of your layout? Use www.jsfiddle.net

Leave a Reply

Your email address will not be published.