- This topic is empty.
-
AuthorPosts
-
April 28, 2009 at 3:22 pm #24717MeshachMember
Hello Everyone.
First of all I have a div, and I put my login into in and put display:none; on it to make it not appear when the page loads. Next I have a text link for when you click it will fade the div in using JavaScript (scriptaculous).
Now in Firefox, IE7+, Opera and Safari it works excellent.. In IE6 it’s a different story, it won’t show my images in the div when it fades in. It shows text links and the form with inputs but no images appear.
I’m hoping a CSS expert can help me here.
XHTML:
Code:CSS:
Code:div#login-panel {
width:350px;
height:155px;
position:absolute;
left:55%;
background:url(‘../images/content_top_gradient.gif’) repeat-x;
border:1px solid #000;
background-color:white;
-moz-border-radius-bottomright:10px;
-webkit-border-bottom-right-radius:10px;
-moz-border-radius-bottomleft:10px;
border-top:none;
border-right:1px solid #333;
border-bottom:1px solid #333;
border-left:1px solid #333;
}
div#login-panel-inner {
width:350px;
height:55px;
margin:0 auto;
}
label.email-address {
margin-left:20px;
}
input#login-email-address {
margin-top:3px;
}
label.password {
margin-left:20px;
}
input#login-password {
margin-top:10px;
margin-left:29px;
}
input#login-button {
position:relative;
left:293px;
bottom:22px;
border:none;
}
img#login-icon-close {
position:absolute;
top:5px;
right:5px;
}Here is what I want it to look like (firefox, opera, safari, ie7+ etc):
[img]http://i42.tinypic.com/312ei6s.jpg[/img]Here is what I don’t want it to look like (IE6):
[img]http://i44.tinypic.com/2z7l8k9.jpg[/img]I would appreciate any help.
MeshachApril 28, 2009 at 6:00 pm #56862AshtonSandersParticipantHi Meshach,
It sounds like scriptaculous is not making the images appear.
Do you have a link to the page?
Also, when you post the HTML, could you post it from the client side? (ie without the PHP)
April 28, 2009 at 6:45 pm #56865MeshachMemberGreetings Mr. Sander.
It most likely isn’t script.aculo.us because when I take off display:none; then the images will show up just fine in IE6.
Here is the code:
XHTML:
Code:I appreciate your response… Looking forward to getting this resolved.
MeshachApril 28, 2009 at 7:44 pm #56869AshtonSandersParticipantHey,
I’ve looked through your code, and have one idea. If you had a live link where it’s not working, I would be able to help you a little more.
Here’s my idea: Try adding the blow just to make sure the images aren’t inheriting the display:none from the div.
Code:div#login-panel img {
display:block;
}"Meshach" wrote:It most likely isn’t script.aculo.us because when I take off display:none; then the images will show up just fine in IE6.When you take off display: none, you change two things:
1) the images aren’t hidden to begin with and
2) Scriptaculous doesn’t try to unhide them.Either one of those could be breaking it.
Let me know how it goes, and if you have a link.
Ashton SandersEdit: spelling…
April 28, 2009 at 9:13 pm #56874MeshachMemberOk Ashton, I have sent you a link via PM.
Meshach
May 24, 2009 at 4:11 pm #58107AshtonSandersParticipantbtw… this was handled:
The problem was that the offending Image was 1) a .png and 2) started inside a "display:none" div. He was using a png hack to get the transparency to work in IE6.
The combination of the PNG hack, and starting how hidden resulted in never appearing when the script later made the div visible.
Solution: make it a jpg.
l8r,
(srry bout the necro…)
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.