Button merging into list element in IE 7

bursatranspuri

New Member
I have a problem with a group of buttons which merge into a list element only in IE 7 or below. So all the buttons appear along with \[code\]Title 2\[/code\] in second li element. Please see html and css below\[code\] <ul class="tabs"> <li><a href="http://stackoverflow.com/questions/13847150/#tab1">Title 1</a></li> <li><a href="http://stackoverflow.com/questions/13847150/#tab2">Title 2</a></li> <span class="button-span"> <button id="print" title="Print"> <img alt="Print" src="http://stackoverflow.com/questions/13847150/images/ico-print.png" border="0"/> </button> <button id="save" title="Save"> <img alt="Save" src="http://stackoverflow.com/questions/13847150/images/word.gif"/> </button> </span> </ul>\[/code\]CSS\[code\]ul.tabs li { background: url('../images/gradient-black.png') repeat-x top left #262626;border-top: 1px solid #444;border-left: 1px solid #535250;border-right: 1px solid #535250;-webkit-border-top-left-radius: 6px;-moz-border-top-left-radius: 6px;border-top-left-radius: 6px;-webkit-border-top-right-radius: 6px;-moz-border-top-right-radius: 6px;border-top-right-radius: 6px;cursor: pointer;float: left;margin: 0 5px 0 0;padding: 6px 20px;overflow: hidden;text-align: center;width:200px;}span.button-span {margin-right:35px; float:right; clear:both; }\[/code\]
 
Back
Top