Pictures over the edge
URL to the page in question:
http://www.pokos.at
-
Hi,
I have a problem with a few pics I added to the content area.
If I open the page in chrome, everything is in its place – but when it comes to firefox or ie, the pictures occur much bigger and reach out over the edge…
It’s this landing-page:
http://www.pokos.at/sundaes_hausgemacht/
Everything else works very well and my client is really happy with the theme – great work!
I would be really, really happy if you could help me with my problem:-)
I have added the two different screenshots…
Thank you very much!
Best regards,
Wolfgang Gschaider
Good Morning Wolfgang,
Thank you for your business first of all. Sorry for the trouble there. It looks like the images there are added via a table, which is fine. Some browsers handle that just a bit differently from one another.
You might have better luck using a div for that. Here’s what it could look like:
<div class="quick-gallery">
<a href="http://www.pokos.at/wp-content/uploads/2014/08/sundae_2.jpg"><img class="size-full wp-image-537" src="http://www.pokos.at/wp-content/uploads/2014/08/sundae_2.jpg" alt="sundae_2" width="300" height="300" /></a>
<a href="http://www.pokos.at/wp-content/uploads/2014/08/sundae_3.jpg"><img class="size-full wp-image-538" src="http://www.pokos.at/wp-content/uploads/2014/08/sundae_3.jpg" alt="sundae_3" width="300" height="300" /></a>
<img class="size-full wp-image-536" src="http://www.pokos.at/wp-content/uploads/2014/08/sundae_11.jpg" alt="sundae_1" width="300" height="300" />
</div>
For each image, when you insert it, choose the “none” option for the alignment. Next we’ll need to add a bit of CSS to match the styling of the table. Here’s how to do that:
- Go to your theme options page and choose the Advanced tab.
- Scroll down to the Custom CSS box and add this:
.quick-gallery {
text-align: center;
padding-top: 10px;
margin-bottom: 30px;
max-width: 600px;
margin-left: auto;
margin-right: auto;
border-top: 1px solid #DDDDDD;
}
.quick-gallery img {
display: inline-block;
width: 30%;
margin-left: 1%;
margin-right: 1%;
}
- Update your settings.
See how that works for you. Let me know if you have any questions or trouble.
Thanks,
Bill
Hi Bill,
thank you very much for the quick support – perfect!
It took me a while, but now it works:-)
I am looking forward to install the Elite Theme 🙂
Best regards,
Wolfgang
Fantastic. If you need anything else, just let me know.
Take care,
Bill
- The topic ‘Pictures over the edge’ is closed to new replies.