Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
ie and safari hanging background position?
I have a pretty detailed CSS drop down list here
In IE and Safari, the “gatherings” tab, hangs (the background image), and won’t switch over when the section changes.
Can someone help me bug test this.
YOu may need to keep your cache empty as it seems to “get better” over time :)
Thanks,
Matthew
- I am Squared Eye and I
am launchinghave launched Pattern Tap
Offline
#2 2006-10-08 20:53:58
- NyteOwl
- Member

- From: Nova Scotia, Canada
- Registered: 2005-09-24
- Posts: 539
Re: ie and safari hanging background position?
The background changes here (albeit very slowly). The problem I had in IE was that the logo disappeared as did the upper menu entries on mouseover. Might have be due to having activex disabled. I’ll try again after supper – I’m being “paged” :)
Obsolescence is just a lack of imagination. / 36-bits Forever! / #include <disclaimer.h>;
Offline
Re: ie and safari hanging background position?
I’d love to know what you find out. Its been treating me weirdly :)
- I am Squared Eye and I
am launchinghave launched Pattern Tap
Offline
Re: ie and safari hanging background position?
Yeah, I get it in IE6 and 7.
- Have you tried removing the invalid, IE-only HTML? (wrapping an
aaround a table)? To get :hover to work in IE, try a Suckerfish menu (JS) or hover.htc- Why are you using a table to contain the list? You could replace it with a
ulor even use adt(main) anddd(drop down) combination. (Son of Suckerfish)
- Why are you using a table to contain the list? You could replace it with a
- Maybe it’s choking on your css?
- Have you tried using the IE Dev toolbar?
If your CSS file weren’t so large, I’d try to help a little more, but ~18kb is too much to wade through :P. Good luck! Here’s a lighter version of the page. It’s always best to simplify and tab when IE is wreaking havoc. It’d be easier to (hopefully) find the source.
<pre>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml” xml:lang=“en” lang=“en”>
<head>
<meta http-equiv=“content-type” content=“text/html; charset=utf-8” />
<link rel=“stylesheet” href=“http://liberti.artiswork.org/css/liberti.css” type=“text/css” media=“screen” />
<title>Liberti</title>
</head>
<body>
<div id=“wrapper”>
<div id=“main”>
<div id=“maininner”>
<div id=“logo_city”>
<div id=“head”>
<h1 class=“hide”><a rel=“home” href=“http://liberti.artiswork.org/”>liberti</a></h1>
<h2 class=“hide”>liberti means freedom</h2>
</div><!--close head-->
<a id=“logo” href=“http://liberti.artiswork.org/”></a><!--What’s the point of this?-->
</div><!--close logo_city-->
<div class=“nav_header”>
<ul>
<!--GATHERINGS-->
<li>
<a class=”“ href=“http://liberti.artiswork.org/gatherings”>
<span class=“hide”>gatherings</span>
</a>
<table>
<tbody>
<tr>
<td>
<ul>
<li><a href=“http://liberti.artiswork.org/gatherings”>gatherings</a></li>
<li><a href=“http://liberti.artiswork.org/home-meetings”>home meetings</a></li>
<li><a href=“http://liberti.artiswork.org/gatherings/northern-liberties”>northern liberties</a></li><li><a href=“http://liberti.artiswork.org/gatherings/fairmount”>fairmount</a></li><li><a href=“http://liberti.artiswork.org/gatherings/north-west”>north west</a></li><li><a href=“http://liberti.artiswork.org/gatherings/campus-gatherings”>campus gatherings</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
</li>
<!--WHO WE ARE-->
<li>
<a class=“who-we-are” href=“http://liberti.artiswork.org/who-we-are”>
<span class=“hide”>who we are</span>
</a>
<table>
<tbody>
<tr>
<td>
<ul>
<li><a href=“http://liberti.artiswork.org/who-we-are”>We are a church</a></li>
<li><a href=“http://liberti.artiswork.org/who-we-are/how-we-seek-to-live”>How we Seek to Live</a></li><li><a href=“http://liberti.artiswork.org/who-we-are/how-we-think”>How We Think</a></li><li><a href=“http://liberti.artiswork.org/who-we-are/what-we-believe”>What We Believe</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
</li>
<!--COMMUNITY-->
<li>
<a class=“community” href=“http://liberti.artiswork.org/community”>
<span class=“hide”>community</span>
</a>
<table>
<tbody>
<tr>
<td>
<ul>
<li><a href=“http://liberti.artiswork.org/community”>what is community?</a></li>
<li><a href=“http://liberti.artiswork.org/photos”>liberti photos</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
</li>
<!--MERCY-->
<li>
<a class=“mercy” href=“http://liberti.artiswork.org/mercy”>
<span class=“hide”>mercy</span></a>
<table class=“mercy”>
<tbody>
<tr>
<td>
<ul>
<li><a href=“http://liberti.artiswork.org/mercy”>Compassion</a></li>
<li><a href=“http://liberti.artiswork.org/mercy/biblical-counseling”>Biblical Counseling</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
</li>
</ul>
</div><!--close nav_header-->
</div><!--//maininner-->
</div><!--//main-->
</div><!--//wrapper-->
</body>
</html
</pre>
Offline
Re: ie and safari hanging background position?
JM,
thanks for your thoughts. I got the code example from Stuart over at cssplay
The drop down in CSS specific and does not rely on JS, which can be an accessibility issue, which is why I have used it this way. I am looking for new solutions, but trying to maintain the level of accessibility if possible.
Thanks for your thoughts there.
Yeah, big css file. I’m widdling it down as I can :)
I’ve reduced it to 14k compressed.
Matthew
- I am Squared Eye and I
am launchinghave launched Pattern Tap
Offline
Re: ie and safari hanging background position?
JM,
I’ve got a test going now here: liberti.artiswork.org/test
The CSS is menu only, I’ve implemented something similar to son of suckerfish from this site.
I have all of the menu working, but the Mercy section. I’m stumped. Care to continue lending a hand :)
Thanks.
- I am Squared Eye and I
am launchinghave launched Pattern Tap
Offline
Re: ie and safari hanging background position?
Thanks—almost done, I think.
Offline
Re: ie and safari hanging background position?
D’oh! I didn’t read that only the mercy part wasn’t working. I just recoded a whole bunch of stuff for no reason. Check your email for that! It’s slightly less CSS (but some extreme tabbing!). This is what caused it:
<code>
float: none !important; /*For Opera – not needed, at least w/the menu alone*/
float: left; /*For IE*/
</code>
Offline