Geek Answers Handbook

Using a field with a mapping table

I tried adding margin-left / margin-right to li, but that does not give them a gap between them. What should I add to make a space between the list?

CSS

.btn-top { float: right; height: 40px; margin-right: 10px; margin-top: 10px; } .btn-top ul { height: 100%; padding: 0; } .btn-top ul li { list-style-type: none; display: table-cell; width: 100px; height: 30px; vertical-align: middle; text-align: center; border-style: solid; border-color: #333; border-width: 2px; border-radius: 10px; }

HTML:

 <div class="btn-top"><ul> <li><a href="#"><span class="btn" =>btn1</span></a></li> <li style="width:150px"><a href="#"><span class="btn">btn2</span></a></li> </ul>
+6
source share
1 answer

display: table-cell displays your element as if it were in a <table> , where, unfortunately, it does not work with fields. You can add another <div> inside this element and give it a margin or just give it an addition. It really depends on the design you want.

+4
source

More articles:


All Articles