Snapbar

Snapbar encourage the customization of iframes in order to match your site's specific needs! 

Note: these styles will not apply to the Gallery itself, but to the embedded window that the gallery is occupying

Within the <code>style="..."</code> portion of your iframe you'll see a lot of customization options:

style="width:100%;height:100%;border:none;background-color:#ffffff;margin-top:15px"

You can edit, add, or remove any section of the style section in order to accommodate your site's needs.

<a href="https://www.w3schools.com/cssref/pr_dim_width.asp" rel="nofollow noopener noreferrer" target="_blank">width</a>: can use percentages (<code>width:100%</code>), or pixel values (<code>width:400px</code>), <code>auto</code>, or <code>inherit</code>

<a href="https://www.w3schools.com/css/css_border.asp" rel="nofollow noopener noreferrer" target="_blank">border</a>: dotted, dashed, solid, etc.

<a href="https://www.google.com/search?q=css+height&amp;ei=HkWMYfrGBNHj2roP9K2z-As&amp;oq=css+height&amp;gs_lcp=Cgdnd3Mtd2l6EAMyBAgAEEMyBAgAEEMyCAgAEIAEELEDMgUIABCRAjIFCAAQkQIyBQgAEIAEMgQIABBDMgQIABBDMgUIABCABDIFCAAQgAQ6BwgAEEcQsAM6BwgAELADEEM6BwgAELEDEENKBQg8EgEySgQIQRgAUMMGWKwKYN4QaAJwAngCgAHfAogB2geSAQczLjEuMS4xmAEAoAEByAEKwAEB&amp;sclient=gws-wiz&amp;ved=0ahUKEwj6zZjN6Y70AhXRsVYBHfTWDL8Q4dUDCA4&amp;uact=5" rel="nofollow noopener noreferrer" target="_blank">height</a>: can use percentages (<code>width:100%</code>), or pixel values (<code>width:400px</code>), <code>auto</code>, or <code>inherit</code>

<a href="https://www.w3schools.com/css/css_margin.asp" rel="nofollow noopener noreferrer" target="_blank">margin</a>: can use percentages (<code>margin-bottom: 10%</code>), pixel values (<code>margin-left: 25px</code>), <code>auto</code>, or <code>inherit</code>

- <a href="https://www.w3schools.com/cssref/pr_dim_width.asp" rel="nofollow noopener noreferrer" target="_blank">width</a>: can use percentages (<code>width:100%</code>), or pixel values (<code>width:400px</code>), <code>auto</code>, or <code>inherit</code>
- <a href="https://www.w3schools.com/css/css_border.asp" rel="nofollow noopener noreferrer" target="_blank">border</a>: dotted, dashed, solid, etc.
- <a href="https://www.google.com/search?q=css+height&amp;ei=HkWMYfrGBNHj2roP9K2z-As&amp;oq=css+height&amp;gs_lcp=Cgdnd3Mtd2l6EAMyBAgAEEMyBAgAEEMyCAgAEIAEELEDMgUIABCRAjIFCAAQkQIyBQgAEIAEMgQIABBDMgQIABBDMgUIABCABDIFCAAQgAQ6BwgAEEcQsAM6BwgAELADEEM6BwgAELEDEENKBQg8EgEySgQIQRgAUMMGWKwKYN4QaAJwAngCgAHfAogB2geSAQczLjEuMS4xmAEAoAEByAEKwAEB&amp;sclient=gws-wiz&amp;ved=0ahUKEwj6zZjN6Y70AhXRsVYBHfTWDL8Q4dUDCA4&amp;uact=5" rel="nofollow noopener noreferrer" target="_blank">height</a>: can use percentages (<code>width:100%</code>), or pixel values (<code>width:400px</code>), <code>auto</code>, or <code>inherit</code>
- <a href="https://www.w3schools.com/css/css_margin.asp" rel="nofollow noopener noreferrer" target="_blank">margin</a>: can use percentages (<code>margin-bottom: 10%</code>), pixel values (<code>margin-left: 25px</code>), <code>auto</code>, or <code>inherit</code>

If you feel confident with HTML and CSS, you can use many of (but not all) the options found <a href="https://www.w3schools.com/cssref/" rel="nofollow noopener noreferrer" target="_blank">here</a>.

Gallery embed code styling basics