+ 1
How to Align a list in HTML?
How can someone align a list in the left, right and center in HTML?
12 Answers
+ 7
Is this what you want? :
<html>
<head>
<title>learning HTML </title>
<body>
<ul style="float:left;">
<li> green </li>
<li>blue </li>
<li>yellow </li>
<li>Black</li>
<li>Brown</li>
</ul>
<ol style="float:right;">
<li> green </li>
<li>blue </li>
<li>yellow </li>
<li>Black</li>
<li>Brown</li>
</ol>
</body>
</head>
</html>
(the one floats next to the other)
+ 6
Just don't put float:right; to the first! ^_^
+ 6
Don't use <center> just put style="float:right;" to the second list…
+ 5
<center><dl>Test</dl><dd>test</dd></center>
+ 4
<center>
align="left"
text-align:right;
vertical-align:middle; ……
(many ways…)
+ 2
Remember, the center tag is deprecated and you should not use it. Instead, use css, like the first example provided by Valentin or the one provided by Uran. I myself put always inline tags as inline-blocks, give them a width, and use margin: 0 auto; to center most of the things horizontally.
+ 1
ul li {
text-align: left | center | right;
}
+ 1
Thanks a lot for both of you.
Would you please give me an example, Since I'm very new with HTML it would be very helpful to have one.
+ 1
Thank you Valetinhacker!
Just one favor to ask, would you please, please tell me how should I write the example down bellow so I will have it align to the center, and then to the right?
<html>
<head>
<title>learning HTML </title>
<body>
<ul>
<li> green </li>
<li>blue </li>
<li>yellow </li>
<li>Black</li>
<li>Brown</li>
</ul>
<ol>
<li> green </li>
<li>blue </li>
<li>yellow </li>
<li>Black</li>
<li>Brown</li>
</ol>
</body>
</head>
</html>
+ 1
Thank you ValentineHacker so much for the trick. :-)
Although that's not the result that I was looking for, still the trick is so greaaaaaaat.
what I want is the lists to be under each other on the right then under each other on the left and under each other on the center, not next to the other, would you tell me how can I do it, please?
0
@KINGODX thank you so much.
I'm very new at HTML, I don't know how would I use what you are saying to have a the code that you are talking about. :-(
0
I want the two lists to be both present, and aligned beneath each other, and that's how I want the result to looks like on the browser
1----left
1.green
2.blue
3.yellow
4.Black
5.Brown
-green
-blue
-yellow
-Black
-Brown
2-----Right
1.green
2.blue
3.yellow
4.Black
5.Brown
-green
-blue
-yellow
-Black
-Brown
3-----Center
1.green
2.blue
3.yellow
4.black
5.Brown
-green
-blue
-yellow
-black
And it seems that the center dont work with float
Often have questions like this?
Learn more efficiently, for free:
Hot today
<--Cursor Point--/>
9 Votes
pls sololearn fix this
1 Votes
Prime Numbers
0 Votes
AI courses
0 Votes
SINTAX ERROR WHERE?
1 Votes
I want to learn HTML / CSS
0 Votes