html - Keeping lists horizontal at all times -
i'm having trouble trying keep list horizontal, haven't been able find anywhere , white-space: nowrap doesn't work. don't mind 4 items being underneath text after screen size it's gotta horizontal still, in case goes vertical , can't figure out why, there's fiddle try out re-sizing , you'll mean!
<div class="menu"> <h2> text </h2> <ul> <li><a>test1</a></li> <li><a>test2</a></li> <li><a>test3</a></li> <li><a>test4</a></li> </ul> </div>
please css or html fixes!
thank you!
h2 { display: inline; } ul { text-align: right; margin-right: 100px; white-space: nowrap; } li { display: inline-block; } { padding: 14px 16px; }
<div class="menu"> <h2> text </h2> <ul> <li><a>test1</a></li> <li><a>test2</a></li> <li><a>test3</a></li> <li><a>test4</a></li> </ul> </div>
float not friend
just change ul , li styles looks follows:
ul { margin-right: 100px; white-space: nowrap; text-align: right; } li { display: inline-block; }
Comments
Post a Comment