Welcome to WebmasterWorld Guest from 54.205.74.11

Forum Moderators: incrediBILL

Extra wide page only in IE7

   
6:17 pm on Nov 4, 2010 (gmt 0)



I have been trying for weeks to get rid of a spacing in IE7 and am at a loss as to what is causing it..do you guys think you could take a look at the page and maybe help me out? I have go through so many page revisions I have basically started trying the same things over again. In FF, IE8, Chrome and Safari the width is perfect...IE7 is bugging me like crazy.

Below is a pic of the space. You can see it next to TRAVEL CASES. it is like something starts to stretch the page, making the menu bar start to show another button.

[img688.imageshack.us ]

Here is a link to the website. Remember, this only happens in IE7

[jewelryboxavenue.com ]


thanks guys
1:11 pm on Nov 5, 2010 (gmt 0)

5+ Year Member



guod, why don't you use a conditional comment:

Stick this in your source code

<!--[if IE7]>
<style type="text/css">

ElementBrokeinIE7 {
width:200px
}

</style>
<![endif]-->

It looks like you've got the width of that menu set with inline style though, so bear in mind that the inline style may override the conditional comment
2:37 pm on Nov 5, 2010 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



It's also worth noting that there are a ton of nested tables (tables within tables), which make this sort of troubleshooting a terrible headache. Just one reason to avoid this sort of nested tables for layout.
4:03 pm on Nov 5, 2010 (gmt 0)



thanks for the replies.
@milosevic

I added that code in there and had no change. Not sure what that code was supposed to do, but I think some conditional code is going to be required.

@fotiman

I know..it is a complete mess. I did not do the original design of the page and am working with what I have for the moment. I think that if everything was in its own table or something of that nature, things would be 100% easier. I know it must be inheriting some width from somewhere or something crazy..


Also, not sure if it's worth noting, this is where I got the code for the menu bar.

[dynamicdrive.com...]
4:59 pm on Nov 5, 2010 (gmt 0)

5+ Year Member



guod, obviously you need to replace "elementbrokeninIE7" with the selector for the element which is broken in IE7. I also doubt 200px will be the correct width for you.

This code should fix your problem much more simply than any other fix.
5:56 pm on Nov 5, 2010 (gmt 0)



I think I should have been a little more clear in my relply. sorry.

I do not know what to change. I tried changing the width of the div, but I see no change. I have been trying to use IE dev tools to edit it on the fly. I also tried to put the code in with the width of that div changed and I still see no results...

this means it is coming from somewhere else right? something else in the top menu is pushing it out right?
6:51 pm on Nov 5, 2010 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



The <td>'s in the <tr> that contains "FRAME_SEARCH" each have width values assigned. When I remove those widths (via the IE Dev Toolbar), it lines up much more nicely. So I suspect therein lies your problem.
11:06 pm on Nov 5, 2010 (gmt 0)



thanks for helping me. I was able to get that width adjusted and the page looks good now. For some there is still a little gap on an actual product page, but I'll have look around and see what causes it
 

Featured Threads

My Threads

Hot Threads This Week

Hot Threads This Month