CODEWITHSUNDEEP
htmlcssinternet-explorer
brietsparks
brietsparks

Reputation: 5016

display problems in IE with this responsive theme

I am using a Wordpress responsive child theme that is totally out of whack in IE. The site shows correctly in Mozilla and Chrome. I am sifting through the IE dev tool element inspector and changing things by trial and error, but other than that I have no idea what I am doing (in IE that is). Any pointers or references I would greatly appreciate. Is there an IE fix I should be aware of? Thanks

The site link

Upvotes: 0

Views: 38

Answers (2)

nikita
nikita

Reputation: 277

IE follows some standard format if you have not place div appropriately then it will break in IE for example: In your code header logo is on left hand side but it doesn't have float:left or width specified try to specify css for divs where to place Like following example You can specify width in % for responsive and make changes for different screens using media query

<section id="wrapper">
        <div class="div1">
        </div>
        <div class="div21"></div>
        <div class="div22"></div>
        <div class="div3"></div>
    </section>
<style>
    #wrapper {
        width:1000px;
        margin:0 auto;  
    }
    .div1 {
        width:998px;
        border:1px solid #000;
        height:300px;
        background:#f0f0f0;
    }
    .div21,.div22 {
        width:498px;
        border:1px solid #000;
        height:300px;
        float:left;
        background:#dfdfdf;
    }
    .div22 {
        background:#999;    
    }
    .div3 {
        width:498px;
        margin:0 auto;
        height:300px;
        border:1px solid #000;
        overflow:hidden;    
        background:#333;
    }
</style>

Upvotes: 1

Sahil Purav
Sahil Purav

Reputation: 1354

Hi If you are using advance CSS 3 then you should always consider yourself in trouble with old IE. I would suggest you to take a look at CSS 3 PIE Follow the instructions and add it in your site.

Upvotes: 0

Related Questions