Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Wordpress Expositio Theme problem WordPress

  • REFUNDED

Hello everyone!

I am currently setting up a portfolio site. I love the theme I got but there is a major downside.
I would like for the pictures on the posts to be responsive but scaling down only, not scaling up. At the moment the pictures are scaling up to fit the screen resolution. My monitor is pretty big and when the images are scaled up this much they are getting blurry, it's looking bad. I need them to stay true to the size and never bigger.

The site in question: http://www.jamespimlott.co.uk/

Can anyone advice on this one ?
Many thanks!

Answers (1)

2014-07-14

Spencer Tomosvary answers:

Hi.

The responsive CSS looks pretty good to me at all sizes, but I'm just on a laptop.
Try adding this to your custom css:

.post img {
max-width: 1000px !important;
}

Then you can increase or decrease the 1000px limit to your liking.


Spencer Tomosvary comments:

This might be a better approach..

try instead

img {
max-height:1500px !important;
}

And adjust that number. Let me know if any of the images appear stretched out / distorted / scewed.

-Spencer


mizzflowerpot comments:

Thank you for your help! I seemed to find the solution myself.
I changed the percentage in:

* 6.5 Gallery
* -----------------------------------------------------------------------------
*/
.gallery {
display: inline-block;
width: auto;
height: 90%;
margin: 0;
list-style-type: none;
}

.gallery-item {
display: inline-block;
width: auto;
height: 90%;
padding-right: 20px;
padding-right: 2rem;
vertical-align: top;
white-space: normal;
}

.gallery-item img {
display: block;
width: auto;
height: 90%;
height: -moz-calc(100% - 28px);
height: -webkit-calc(100% - 28px);
height: calc(100% - 28px);
}


And the images display smaller!


Spencer Tomosvary comments:

that's great. If you can instead add a rule to set a max-height in pixels for each, I think it would be better. Because by changing the percentage you've reduce the size globally and if someone has a larger display than you it would still blur.


mizzflowerpot comments:

Yeah, I think this would be better. I'm just a bit afraid to mess it up. I'm at a beginners level with this stuff :D . This is only temporary, since I am working on designing my own layout for this website. So far we just wanted something simple to present the work in a nice way.

Many thanks again ! :-)