• Registered: 2012-12-10
  • Posts: 8

Topic: IE Correct - Chrome / Mozilla not

When I check my webpage in IE9 the gallery displays full size.  However, in Firefox and Chrome the gallery does not display full size.  The gallery is setup without thumbnails.  I am running the latest version of all browsers and flash.  Also javascript is enabled.

  • Registered: 2008-07-06
  • Posts: 6,311

Re: IE Correct - Chrome / Mozilla not

Please see this FAQ which may help:
My gallery does not show in Firefox or gets cropped to a small height. Why?

If you continue to experience difficulties, please post the URL to your gallery so that I can take a look.

Steven Speirs
SimpleViewer Support Team
  • Registered: 2012-12-10
  • Posts: 8

Re: IE Correct - Chrome / Mozilla not

Still having issues.

This is my CSS file:

@charset "utf-8";

/* CSS Document */

#container {width: 966px;
            background: #fff;
            margin: 0 auto;
            padding-left: 10px;
            padding-right: 10px;
            overflow: hidden; 
}

h1 {
    font-family: merienda-one, serif;
    font-size: 60px;
    float: left;
    margin: 0;
    color: #66FF00;
}

#header {
    color: #FFF;
    background-color: #000;
    height: 100px;
    position: relative;
}

#footer {
    color: #FFF;
    background-color: #000;
    }

#gallery_content {
    background-color: #000;
    position: relative;
    margin: 0 auto;
    padding: 10px;
}

#header ul {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    position: absolute;
    right: 0px;
    bottom: 0px;
}

body {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    color: #3b3b3b;
    background-color: #333;
    padding: 0px;
}
#header  a {
    font-size: 14px;
    font-weight: bold;
    font-variant: small-caps;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    display: block;
    width: 100px;
}
#header ul li {
    float: left;
}
#header p {
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 18px;
    font-variant: small-caps;
    margin-top: 0px;
    margin-left: 0px;
    padding-top: 15px;
}

#left-column, #right-column {
    width: 474px;
    float: left;
    }

#right-column {
    margin-left: 17px;
}
#left-column p {
    font-size: 30px;
    font-variant: small-caps;
    background-color: #000;
    text-align: center;
    color: #FFF;
}
#right-column p {
    font-size: 30px;
    font-variant: small-caps;
    color: #FFF;
    text-align: center;
}


This is my html code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>It's Your Party - Home</title>
<script src="http://use.edgefonts.net/merienda-one.js"></script>
<link href="iyp_style_sheet.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="container">
  <div id="header">
    <h1>It's Your Party</h1>
    <p>The Finest in Event Planning</p>
    <ul>
      <li><a href="index.html">Home</a></li>
      <li><a href="about_us.html">About Us</a></li>
      <li><a href="services.html">Services</a></li>
      <li><a href="#">SlideShow</a></li>
      <li><a href="#">Contact Us</a></li>
    </ul>
  </div>
  <div id="gallery_content">
   <!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "000000", true);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->
  </div>
  <div id="footer">&copy;2013 Web Development by Michael Slansky</div>
</div>
</body>
</html>

  • Registered: 2008-07-06
  • Posts: 6,311

Re: IE Correct - Chrome / Mozilla not

When specifying the height of your gallery as a percentage, it is necessary to ensure that all parent containers of the gallery (up to and including the 'body' and 'html' tags) have heights specified via CSS.
Your gallery is nested within the 'gallery_content' and 'container' div so you would need to set heights for '#gallery_content', '#container', 'body' and 'html' via CSS.
Please also see the note regarding Using Percentage Heights in the SimpleViewer Embedding Guide.

Otherwise, a quick fix might be to simply specifying the height of your gallery as an absolute pixel value, e.g.:

simpleviewer.load("sv-container", "100%", "600", "000000", true);
Steven Speirs
SimpleViewer Support Team