Can't Get The Sprite Image To Appear

HTML & CSS
1

I have a site I am working on and I have included the script for PrettyPhoto.

If you view the site linked below there is a button within the blue sidebar on the bottom right that reads “Find Out More”. It launches the script and everything seems to work well EXCEPT for the “close” button.

LINK-
http://www.securehostserver.info/rainscapes/

If someone can figure this out I would greatly appreciate it!
It shouldn’t take someone with Firebug too long to correct the page so that the close button will begin to work. Right now it is invisible.

Todd

2

Thank you so much Rayzur!

I think I made a mistake when reviewing the prettyPhoto Javascript file that adds the <div class=“pp_details clearfix”> and thought it was its own class, like <div class=“pp_details_clearfix”>. Ugh! I am not cut out for this. Thank you so much as, again, you have saved the day!!!

Todd

3

Hi.
The problem is the clearfix class that you have hooked to the .pp_details div. The clearfix is in your style.css and it has height:0 so that is why the close button is hidden.


<div class="pp_details [COLOR=Red]clearfix[/COLOR]" style="width: 695.9px;">
<a href="#" class="pp_close">Close</a>     

</div>


[B]style.css (line 9)[/B]
.clearfix {
[COLOR=Red]height:0;[/COLOR]
overflow:hidden;

Just remove that clearfix class from the html and do your float containment on the pp_details

<div class="[COLOR=Blue]pp_details[/COLOR]">
<a href="#" class="pp_close">Close</a>     
</div>

[B]prettyPhoto.css (line 233)[/B]
.pp_content_container [COLOR=Blue].pp_details[/COLOR] {
    margin:10px 0 2px;
    [COLOR=Blue]overflow:hidden; /*use this instead of clearfix class*/
    width:695px;/*haslayout IE*/[/COLOR]
}