Proper way to use divs to align divisions of web page on left or right side
I am getting back into web development for a project and I am trying to
learn how to setup my divs so some elements are left aligned and others
are right aligned. Many moons ago before 's were around I would use a
table and set the alignment of the cells but I can't seem to find the
equivalent with div's.
In the below html code I am trying to make the text "My Brand" be on the
left and the "Link 1" and "Link 2" blocks of text to be on the right. All
3 blocks of text should be on the same line and be vertically aligned.
<html>
<head>
<title>Hi Mom</title>
<style>
.header
{
background-color:#BFEFFF;
height:50px;
}
.tagline
{
color: #00A5D8;
font-size: 20pt;
font-family: Helvetica Neue;
font-weight: bold;
vertical-align: middle;
text-indent: 20pt;
display: inline;
}
body
{
margin:0px;
}
</style>
</head>
<body >
<div class="header"><div class="tagline"><p>My Brand</p></div><div
class="tagline"><p>Link 1</p></div><div class="tagline"><p>Link
2</p></div></div>
<div><center>
blah blah
</center></div>
</body>
</html>
Thanks
No comments:
Post a Comment