CODEWITHSUNDEEP
htmlcss
Bob John
Bob John

Reputation: 3878

Trying to position text specifically with CSS, and allow it to move with the page

<!DOCTYPE html>
<html>
<head>

<style type="text/css">
p.titletext
{
font-family:"arial";
font-size:50px;
position:relative;
left:425px;
top:10px;
}
</style>
</head>

<body>
<p class="titletext">Hello World.</p>

</body>
</html>

I'm asking whether there's anything that can handle text positioning that will actually keep the text in its position while the page is being expanded/contracted. In other words, I want the text positioning to following according to the page size. For example, if I make a new paragraph and align it to the center, no matter how large or small the window is, the text will always stay in the center. Is there a way to accomplish this while setting the text position to your liking?

Upvotes: 1

Views: 129

Answers (2)

user1432124
user1432124

Reputation:

Try this way

body{text-align:center;}
p.titletext
{
font-family:"arial";
font-size:50px;
}

UPDATE:-for both horizontal and vertical

<style type="text/css">

p.titletext
{ position:absolute; top:50%; left:50%; height:2em; margin-top:-1em; width:40%; margin-left:-20%;text-align:center; 
font-family:"arial";
font-size:50px;
}
</style>

Upvotes: 1

NullPoiиteя
NullPoiиteя

Reputation: 57322

this can be done by text-align:center and top:50% in p.titletext and remove position:relative so it will always on center

Upvotes: 1

Related Questions