- This topic is empty.
-
AuthorPosts
-
November 13, 2012 at 2:33 am #40769k_mcminnMember
Hello, CSS-Tricks! I’m sure many here can agree that Internet Explorer (IE 9 in my case) , in general, is pretty difficult to work with when it comes to CSS.
I have, what appears to be, a float issue happening and I’m really not quite sure how to fix it. I’ve tried a variety of different properties/ values, but can’t seem to get it straightened out.
The link to the issue is:
http://www.nintendonerds.com/categories/wii-u/wii-u-gamepad-battery-replacement-is-easy-r678The bottom portion under the share links, there’s a section called “Other Articles.” In IE9, it looks like this:
http://i.imgur.com/HdhD7.pngIn all other Browsers, it looks perfectly fine, like this:
http://i.imgur.com/au6P8.jpgAny help is getting IE9 to obey like the other Browsers would be greatly appreciated.
November 13, 2012 at 4:22 am #114134Watson90MemberMaybe try and remove the
position: relative;
top: 10;And just add;
margin: 10px 5px 0 0;
November 13, 2012 at 4:49 am #114136k_mcminnMemberThank you for the quick response, Watson90!
Unfortunately, that doesn’t seem to work.
[Image Link](http://i192.photobucket.com/albums/z133/nintendonerds/ie9_a.png “”)
This is what I have for the CSS:
.random_articles_image {
border-radius: 3px 3px 3px 3px;
box-shadow: 1px 1px 2px 1px grey;
float: left;
height: 55px;
margin: 10px 5px 0 0;
/* margin-right: 5px; */
/* position: relative; */
/* top: 10px; */
width: 100px;
}EDIT: I apologize for the code formatting above. I couldn’t get the proper formatting.
November 13, 2012 at 5:11 am #114137Watson90MemberYeah, I did a quick Inpect Element on Firefox & Chrome
You also seem to have a
Is this necessary? Maybe this could be breaking your layout…
November 13, 2012 at 5:19 am #114142k_mcminnMemberAre you referring to this?
About the Author
November 13, 2012 at 5:19 am #114143k_mcminnMemberAre you referring to this?
About the Author
November 13, 2012 at 5:20 am #114145k_mcminnMemberAre you referring to this?
About the Author
November 13, 2012 at 5:21 am #114146k_mcminnMemberMan, I’m having a heck of a time with the formatting for this software, sorry about that.
November 13, 2012 at 5:21 am #114147JoniGiuroParticipantI would place each image and description in a div and float those
November 13, 2012 at 5:22 am #114148Watson90MemberNo, that is fine, it looks like there is an empty
tag under each
with the class of
.random_articles
November 13, 2012 at 5:23 am #114162k_mcminnMemberSo, six separate divs, with the same class?
November 13, 2012 at 5:27 am #114150Watson90MemberMaybe like a div with a class of box or something similar, make it a specific width and height and float it to the left, then on the inside float your image to the left and your description to the right and it should work fine…
November 13, 2012 at 5:31 am #114153k_mcminnMemberI removed that {br} you were talking about. I think it was unnecessary. I’ll try and do what you and Joni suggested.
November 13, 2012 at 6:02 am #114131k_mcminnMemberThis is driving me wild, fellas. Could one of you perhaps, set something up for me to use?
November 13, 2012 at 6:26 am #114132Watson90MemberMaybe something like this? Obviously you’d need to change it to your code but you’ll get the general idea…
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.