Embedding a static sized object on a responsive layout doesn't work well, so we've come up with two options to address this for you.
Option 1: Make your width 100%
The first and easiest option is to embed the TrueTour as an iframe with a 100% width. Your code will look like this:
<iframe height="600" src="TRUETOUR-URL-HERE" width="100%" allowfullscreen="n" mozallowfullscreen="" webkitallowfullscreen="" frameborder="0"></iframe><br />Powered by <a href="https://visitingmedia.com" target="_blank"><strong>TrueTour™ Technology</strong></a>
Option 2: (advanced) Add Responsive Code to
The second option is to embed a fixed width to better fit into your layout, but to also add a bit of code into the header of your page to make it responsive. Your code will look like this:
<head>
<style type="text/css">
iframe, object, embed {
max-width: 100%;
}
</style>
</head>
<iframe height="600" src="TRUETOUR-URL-HERE" width="720" allowfullscreen="n" mozallowfullscreen="" webkitallowfullscreen="" frameborder="0"></iframe><br />Powered by <a href="https://visitingmedia.com" target="_blank"><strong>TrueTour™ Technology</strong></a>
In the above example the style tags will go in the header of your page and the iframe will go in the body of your page.
Still need help? We are more than happy to assist you!