Menu
I'd like to create a simple centered ordered list like the following:
1. one
2. three
3. fifteen
4. two
Everything I'm trying makes the number align flush to the left, rather than stay to the right next to the item. How do I get the result above?
720
Just give the list centered text (e.g. ul. nav { text-align: center; } ) and the list items inline-block (e.g. ul. nav li { display: inline-block; } ). If you want to do it with margin for whatever reason, look into width: fit-content; .
Step 2) Add CSS:Center-align the <div> element, and change the display of <ul> to inline-block .
use
<style type="text/css">
.centered { text-align: center; list-style-position:inside;}
</style>
<ol class="centered">
<li>one</li>
<li>three</li>
<li>fifteen</li>
<li>two</li>
</ol>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
