css internet explorer hacks -


im using rockettheme template , have edited of css code using custom css file.

i have managed how want on firefox , chrome ie looks werid. navigation low (the buttons) , header low.

the website link found below.

http://www.colmanprint.co.nz/rfloorings/

as can see on link menubar down low , header.

at moment im using css code edit .rt-menubar {padding: 0px !important; margin-left:210px;} when remove margin-left:210px; fixes problem menu goes behind logo on chrome , firefox.

so pretty need keep margin-left:210px chrome , firefox have margin-left:0px internet explorer

any ideas great!

for versions of internet explorer ie9, use conditional comments differentiate between ie , other browsers.

here's quick example:

<!--[if ie]>    <link rel="stylesheet" type="text/css" href="ie9-and-below.css" /> <![endif]--> 

then in ie9-and-below.css apply style such as:

#ieparagraph.rt-menubar {    margin-left:0px; } 

where html so:

<div class="rt-menubar" id="ieparagraph">    <ul>other stuff here...</ul> </div> 

if no styling applied in other stylesheets #ieparagraph class .rt-menubar , change left margin of #ieparagraph div 0px in ie9 , under only.


for ie10, conditional comments have been removed - using modernizr feature detection.


Comments

Popular posts from this blog

java - Jmockit String final length method mocking Issue -

asp.net - Razor Page Hosted on IIS 6 Fails Every Morning -

c++ - wxwidget compiling on windows command prompt -