In this tutorial we will show you the solution of text-align center not working, there are many reasons behind this question. This type of error is based on the question that in which HTML Element and under which CSS conditions we are going to use the text-align center.
Now, let us see how to resolve this error under any condition.
Step By Step Guide On text-align Center Not Working :-
In this article, we are going to understand about the text alignment center not working.
And we already discussed that there are many conditions under which this error occurs. So, it is better if we understand how to use the text-align center in HTML.
<!DOCTYPE html>
<html>
<head>
<title> text align center not working </title>
<style>
p {
margin: 0 auto;
text-align: center;
}
</style>
</head>
<body>
<h1>
TalkersCode
</h1>
<h2>
Text align center not working
</h2>
<div style="text-align:center;">
This text is aligned center on a webpage.
</div>
<div style="text-align:center;">
<img src="img_allinOne.png" alt="Image all in one " width="200px" height="200px "/>
</div>
<p>
Text aligned is center here, Sometimes only margin auto helps to align text center. But for surety, we can also apply text align center property
</p>
</body>
</html>- As, here we see that we that in above example we show you an example in which HTML and CSS codes are used.
- Here, first of all, we create a basic structure of HTML, in which we use <!DOCTYPE html> which defines the type of document. And next one is our HTML tags. These tags are paired tags and all the data regarding HTML is written inside these tags.
- After we use our head tag which is again paired tag and contains the title and meta information of the webpage. The data written inside the head is not shown on the webpage.
- Now, next is our title tag which defines the title of the webpage. The tag which has its closing tag is known as a paired tag. So, this is again a paired tag.
- Now, next is the body which is the main tag of HTML. The data which we have written inside the body is shown on the webpage. Mostly all tags which are helpful to show data or information on the screen are written under the body tag.
- As we above see how to apply text-align center in HTML. So, our issue of text alignment center gets resolved. Now, as we understand there may be many elements on which we apply text-align center property but for some reasons that are not applicable.
- So, try to use margin auto, align-content center, etc. which we again understand in our next tutorials.
Conclusion :-
At last, in conclusion, here we can say that with the help of this article we can understand why our text align center is not working.
I hope this tutorial on text-align center not working helps you and the steps and method mentioned above are easy to follow and implement.
About Pragati
