CSS inline/block issue

centormoya

New Member
I am having trouble with css inline/block when using a \[code\]<span>\[/code\] tag.
gYoRA.png
iWcbp.png
As you can see from the images, when you hover over the third message the Delete/Reply controls pop up, I do not wish for them to push the content down. How can I accomplish this?This is my css code:\[code\]ul.inbox { width: 100%; list-style-type: none;}.unread { border: 1px solid #999 !important; background: #eee url("new.png") no-repeat !important; background-position: left center !important;}li span.hidden { clear: both; visibility: hidden;}li span.messageControls { clear: both; float: right; display: inline;}li span.messageControls a { padding: 5px 5px 0 0; font-size: 12px; color: #06c;}li.message { background: #eee; border: 1px solid #ddd; list-style-type: none; display: block; margin: 0 0 10px; padding-left: 30px; background-position: left center;}li.message:hover {}li.message a { text-decoration: none;}li { overflow: hidden;}li span.from { margin: 5px 0 5px 5px; font-family:"Open Sans",sans-serif; font-size: 14px; color: #666; float: left; font-weight: 700;}li span.date { margin: 5px 5px 5px 0; font-size: 12px; float: right; color: #06c;}li p.subject { margin: 5px 0 5px 5px; font-size: 14px; color: #666; clear: both; font-weight: 700;}li p.preview { margin: 5px 0 5px 5px; font-size: 12px; color: #999;}\[/code\]And my 'inbox' code:\[code\]<ul class="inbox"> <li id="1001843" class="message " onmouseout="document.getElementById('1001843MC').className='hidden'" onmouseover="document.getElementById('1001843MC').className='messageControls'" onclick="ajaxMessage(1001843);"> <span class="from">Michael?
 
Back
Top