I have some HTML:
<div align="center" style="border:1px solid red">
This is some text in a div element!
</div>
The Div is changing the spacing on my document, so I want to use a span for this instead.
But span is not centralizing the contents:
<span style="border:1px solid red;align=center">
This is some text in a div element!
</span>
How do I fix this?
EDIT:
My complete code:
<html>
<body>
<p>This is a paragraph. This text has no alignment specified.</p>
<span style="border:1px solid red;text-align=center">
This is some text in a div element!
</span>
</body>
</html>
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
On top of all the other explanations, I believe you're using equal "="
sign, instead of colon ":"
:
<span style="border:1px solid red;text-align=center">
It should be:
<span style="border:1px solid red;text-align:center">
span.login-text {
font-size: 22px;
display:table;
margin-left: auto;
margin-right: auto;
}
<span class="login-text">Welcome To .....CMP</span>
For me it worked very well. try this also
Just use word-wrap:break-word;
in the css. It works.
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>
Span is inline-block and adjusts to inline text size, with a tenacity that blocks most efforts to style out of inline context. To simplify layout style (limit conflicts), add div to 'p' tag with line break.
<p> some default stuff
<br>
<div style="text-align: center;"> your entered stuff </div>
Source: Stackoverflow.com