i new css. designing tab bar menu. using unordered list <ul> tabs. wrote css tab. need add desired space between each tab.
my code is:
#tab-menu li { text-decoration: none; color: #ffffff; } .button { background: #fefefe; background: rgba(254, 254, 254, 1); border-radius: 11px; -moz-border-radius: 11px; -webkit-border-radius: 11px; } #tab-menu ul li { list-style: none; position: relative; float: left; width: 90px; height: 90px; text-align: center; line-height: 50px; /* here need add equal spaces between each tab. */ border-width: 1px 1px 0 1px; background: #d9dada; background: rgba(217, 218, 218, 1); border-radius: 7px 7px 7px 0px; -moz-border-radius: 7px 7px 7px 0px; -webkit-border-radius: 7px 7px 7px 0px; }<body bgcolor="#bfbfbf"> <div id="tab-menu"> <ul> <li> <a href="#"> <img src="01.svg" /> </a> </li> <li> <a href="#"> <img src="01.svg" /> </a> </li> <li> <a href="#"> <img src="01.svg" />/a></li> <li> <a href="#"> <img src="01.svg" /> </a> </li> <li> <a href="#"> <img src="01.svg" /> </a> </li> <li> <a href="#"> <img src="01.svg" /> </a> </li> <li> <a href="#"> <img src="01.svg" /> </a> </li> <li> <a href="#"> <img src="01.svg" /> </a> </li> </ul> </div> <input type="submit" class="button" value="add ticket" /> </body>can me code?
use css
#tab-menu li { text-decoration: none; color: #ffffff; } .button { background: #fefefe; background: rgba(254, 254, 254, 1); border-radius: 11px; -moz-border-radius: 11px; -webkit-border-radius: 11px; } #tab-menu ul li { list-style: none; position: relative; float: left; width: 90px; height: 90px; text-align: center; line-height: 50px; margin-right: 15px;//this adds space border-width: 1px 1px 0 1px; background: #d9dada; background: rgba(217, 218, 218, 1); border-radius: 7px 7px 7px 0px; -moz-border-radius: 7px 7px 7px 0px; -webkit-border-radius: 7px 7px 7px 0px; } 
Comments
Post a Comment