Yahoo Answers is shutting down on May 4th, 2021 (Eastern Time) and beginning April 20th, 2021 (Eastern Time) the Yahoo Answers website will be in read-only mode. There will be no changes to other Yahoo properties or services, or your Yahoo account. You can find more information about the Yahoo Answers shutdown and how to download your data on this help page.
Trending News
How do you align <div> elements?
Like make one <div> element go to the left of the screen, one in the middle, and one to the right, all in the same row. Pretty much how do you make column and rows in <div> like in tables?
Not the text in the <div> element. The whole <div> element.
Grand, all what you gave me is how to align text in the <div> element.
2 Answers
- 1 decade ago
What GrandUse... has said is perfectly all right, except that if you wish to have additional functionality, I'll quickly type in a code for you.
<html>
<head>
<title>Example</title>
<style type="text/css">
#wholething {width:500px; height:400px; position:absolute; left:50%; margin-left:-250px; top:50px; padding:0px;}
.top {position:absolute; top:0px; height:250px; text-align:center; border:none; padding:0px; color:#FFF; font-family:Verdana; font-size:16px;}
.bottom1 {position:absolute; top:250px; text-align:center; border:none; padding:0px; color:#FFF; background-color:teal; font-family:Verdana; font-size:16px;}
#left {position:absolute; left:0px; width:100px; background-color:#CCC;}
#middle {position:absolute; left:100px; width:300px; background-color:#EEE; color:#000;}
#right {position:absolute; left:400px; width:100px; background-color:#CCC;}
#bottom {position:absolute; left:0px; width:500px; height:150px;}
</style>
</head>
<body>
<div id="wholething">
<div id="left" class="top">This is the left-aligned div</div>
<div id="middle" class="top">This is the center-aligned div</div>
<div id="right" class="top">This is the right-aligned div</div>
<div id="bottom" class="bottom1">This is the bottom-aligned div</div>
</div>
</body>
</html>
To quickly view a demo of this example, go to the link given below in the source. Message me if you need any more help!
Source(s): http://yahooanswersexample.webs.com/ - GrandUser1000Lv 51 decade ago
You add on the the opening div tag of the element.
<div align="Right">
CONTENT GOES HERE
</div>
<div align="Left">
CONTENT GOES HERE
</div>
<div align="Center">
CONTENT GOES HERE
</div>
Examples:
<div id="Header" align="Left">
CONTENT GOES HERE
</div>
<div id="Body" align="Center">
CONTENT GOES HERE
</div>
<div id="Footer" align="Right">
CONTENT GOES HERE
</div>
