8 replies [Last post]
n8gz4ez
n8gz4ez's picture
Offline
Leader
Last seen: 12 years 44 weeks ago
Timezone: GMT-6
Joined: 2005-06-13
Posts: 802
Points: 0

Hi,

I am pretty much done with this site except for 2 minor details with IE7 and 6. When resizing in IE7, for some reason my menu list no longer stays centered. Also, in both IE6 and 7 I am getting weird extra padding around links when tabbing through the site with :focus. Any ideas?

Any other suggestions welcome. Smile

Link: yuanspace.com

This is my big chance . . . yep, I blew it . . .

level5
Offline
Enthusiast
Tucson, AZ
Last seen: 12 years 39 weeks ago
Tucson, AZ
Timezone: GMT-7
Joined: 2007-04-17
Posts: 102
Points: 0

try post your css code and

try post your css code and html code so i can view your coding for css it would be helpful.. by looking your website isnt a answer for me Smile

thanks.

----------------------------------------
Regards,
Nick

DanA
DanA's picture
Offline
Elder
Last seen: 11 years 29 weeks ago
Timezone: GMT+2
Joined: 2004-08-14
Posts: 1087
Points: 2

for some reason my menu list

Quote:
for some reason my menu list no longer stays centered

Not sure about this but you may try margin:0 auto; rather than margin:0 in #head ul
Quote:
getting weird extra padding around links when tabbing through the site with :focus.

Seems to be a hasLayout problem.
Try display:inline-block; in #skip li a (to set hasLayout then reset to display:inline; if necessary)

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 7 years 39 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

@level5 - a live link is the

@level5 - a live link is the best thing we can ask for. It gives us the full html and css and allows us to perform different tests with development tools.

@nate - I don't have IE7 so I can't test, but have you tried removing the width: 100% declaration?

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 9 weeks 5 days ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9674
Points: 810

Naaaaaaaaaaaaate! Welcome

Naaaaaaaaaaaaate!

Welcome back Wink

Verschwindende wrote:
  • CSS doesn't make pies

n8gz4ez
n8gz4ez's picture
Offline
Leader
Last seen: 12 years 44 weeks ago
Timezone: GMT-6
Joined: 2005-06-13
Posts: 802
Points: 0

Dan's { display:

Dan's { display: inline-block; } fixed both issues very nicely. Thanks a lot for all the suggestions. Any other suggestions on welcome as well. Glad to be back!

This is my big chance . . . yep, I blew it . . .

n8gz4ez
n8gz4ez's picture
Offline
Leader
Last seen: 12 years 44 weeks ago
Timezone: GMT-6
Joined: 2005-06-13
Posts: 802
Points: 0

I spoke a little too soon. I

I spoke a little too soon. I added { display: inline-block; } to all the anchor tags, which fixed IE7, but now I have a problem with Safari on Mac. The links in Safari seem to be vertical-aligned top (and to the right?). If I adjust the vertical alignment to fix Safari, of course that lowers the position of the links in IE. Any suggestions?

Edit: Also there is something funky going on with the IE7 when resizing using { display: inline-block; } with the links in the content and the skip links at the top . . . almost there.

This is my big chance . . . yep, I blew it . . .

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 7 years 39 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

did you reset the display to

did you reset the display to inline (as DanA mentions)?

Setting the links to display: inline-block; will set hasLayout in IE. Resetting to display: inline in a second rule will maintain hasLayout while resetting the display for other browsers. So for instance, reset like this:
#skip li a {
display: inline-block;
margin: 0;
padding: 0;
}

#skip li a {
display: inline;
}

n8gz4ez
n8gz4ez's picture
Offline
Leader
Last seen: 12 years 44 weeks ago
Timezone: GMT-6
Joined: 2005-06-13
Posts: 802
Points: 0

You're right, I should have

You're right, I should have read that a little closer. Now it looks a lot better, thanks people.

One more issue, now when resizing in IE7, the links in the content box become overlapped. I'm not sure what is going on there . . . so close.

Any suggestions?

This is my big chance . . . yep, I blew it . . .