I am facing some alignment problem that I've performed on some div blocks in Firefox (my version is 2.0.0.1).
My CSS code is as follows
The HTML code I've used is as follows on which I've used the above mentioned CSS code.Code:div#topMain {width:776px;background-color: #804000; border: 2px solid #804000;} div#topMainOne {width:776px;background-color: #804000; border: 2px solid #804000; height:18px;} #logged{width: 340px; color: white; font-family: verdana; font-size: 11px; display: inline;margin-left: auto;} #logged span {color: #F9E700; font-family: verdana; font-size: 11px;font-weight:bold;} #insertComment {width: 235px; color: white; font-family: verdana; font-size: 11px;display: inline;font-weight:bold;margin-left: auto;} #closeComment {width: 190px; color: white; font-family: verdana; font-size: 11px;font-weight:bold;display: inline;margin-left: auto;} #closeComment a {color: white; font-family: verdana; font-size: 11px; font-weight:bold; text-decoration: none;} #closeComment a:hover {color: #F9E700; font-family: verdana; font-size: 11px; font-weight:bold; text-decoration: underline;}
I want to the div blocks with the alignment that I mentioned inside the <div>'s align attribute.Code:<div id="topMain"> <div id="topMainOne"> <div id="logged" align="left">You are logged as <span>Jayaprakash Valappil</span></div> <div id="insertComment" align="center"><em>...Insert your commments...</em></div> <div id="closeComment" align="right"> | <a href="javascript: alert('Action yet to implement');"> Action</a> | <a href="javascript: alert('Help yet to implement');"> ?</a> | <a href="javascript: showHide(0);"><img src="images/closeAddComment.gif" width="15" border="0" align="absmiddle" alt=""></a> </div> </div> </div>
In IE (7) it displays correctly but in Firefox everything is left aligned.
Why it is so?



Reply With Quote



Bookmarks