CODEWITHSUNDEEP
htmlcssimagealignment
Karina
Karina

Reputation: 663

Images aligning vertically instead of horizontally in IE?

I have a problem with some images in IE, they are aligning vertically instead of horizontally, however they are fine in all other browsers? Also when using IE8 and 7 the images are not being displayed at all! Is there a way I can get around this? I have attached my code below:

<div class="header_right_christmas">
            <div class="preflang_christmas">
                    <a href="#" class="delivery_xmas">
                    </a>

                    <a href="#" target="_blank" class="facebook_xmas">
                    </a>

                    <a href="#" target="_blank" class="twitter_xmas">
                    </a>

                    <a href="#" target="_blank" class="pintrest_xmas">
                    </a>

                    <a href="#" target="_blank" class="google_xmas">
                    </a>
</div>


.preflang_christmas {float:right; display:inline-flex;}

.delivery_xmas {
height:40px;
width:196px;
display:block;
background-image:url('myimage.png')no-repeat;
}

.delivery_xmas:hover {
background-image:url('myimage.png');
}

.facebook_xmas {
width:40px;
height:40px;
display:block;
background:transparent url('myimage.png')no-repeat;
}

.facebook_xmas:hover {
background-image:url('myimage.png');
}

.twitter_xmas {
height:40px;
width:40px;
display:block;
background:transparent url('myimage.png')no-repeat;
}

.twitter_xmas:hover {
background-image:url('Christmas_Homepage_Images/twitter.png');
}

 .pintrest_xmas {
height:40px;
width:40px;
display:block;
background:transparent url('Christmas_Homepage_Images/pintrest_bw.png')no-repeat;
}

 .pintrest_xmas:hover {
background-image:url('Christmas_Homepage_Images/pintrest.png');
}

 .google_xmas {
height:40px;
width:40px;
display:block;
background:transparent url('Christmas_Homepage_Images/google_plus_bw.png')no-repeat;
}

.google_xmas:hover {
background-image:url('Christmas_Homepage_Images/google_plus.png');
}

Upvotes: 0

Views: 249

Answers (1)

Karina
Karina

Reputation: 663

Managed to fix by removing no-repeat off of background-image!

Upvotes: 1

Related Questions