title: How To Adjust Gallery Height With CSS
body: <p>I am using <code>SquareSpace</code> for the building blocks of my <a href="https://ryan-gould-7uht.squarespace.com/portraiture/" rel="nofollow">site</a> and creating some custom CSS to fine tune. I'm trying to get the gallery page to display the images with more height. At the moment they are not very big in the slider, especially when viewed on a large monitor, seems like there is a lot of wasted space.</p>
  
  <p>Using Inspect Element, I found there to be some HTML styling the height and restricting it to <code>500px</code>.</p>
  
  <pre><code>&lt;div class="slideshow strip main sqs-gallery-design-strip rendered: id="yui_3_17_2_1_1441831607164_254" style="height: 500px; margin-top: 203:5px;"&gt;
  </code></pre>
  
  <p>Changing the height from <code>500px</code> to <code>600px</code> in Firebug works perfectly, so I tried to apply some custom code to in the SquareSpace site. I used:</p>
  
  <pre><code>.slideshow strip main sqs-gallery-design-strip rendered {
      height: 600px;
  }
  </code></pre>
  
  <p>The injection of code did not have a visible result on the page. Am I writing the CSS incorrectly? Is there something I'm missing here? Please help.. Thank you!</p>