Joomla Templates Club 406,261 posts

[edanzer Friend edanzerJoin date: December 2008Posts: 3Downloads:0Uploads:0 Thanked: 1 times in 1 posts]

#138674

Hi,

I’ve been browsing for a few hours now and I’ve read most threads on image resizing. I haven’t found a solution yet. The frontpage on my site (http://www.slrgeek.com) is resizing images according to both the length and width set in the Frontpage News module. So regardless of the dimension of the original images (landscape, portrait, etc), if I set the image dimensions in the Frontpage news to 250X250, I get a square image of precisely 250X250.

If I set it 255X170, I get a landscape size image. If the original was a portrait image, it just stretches it to 255X170. The images just get distorted.

In previous posts, I’ve read that if you set the image dimensions to 300X300, it will resize an image original of 600X400 to 300X200. That is, it treats the image dimensions as MAXIMUMS, rather than precise width settings.

That’s exactly what I want, it’s just not working like that. Am I missing something?

Erick

[edanzer Friend edanzerJoin date: December 2008Posts: 3Downloads:0Uploads:0 Thanked: 1 times in 1 posts]

#293935

Think I just fixed it myself. Just added a

width: 250px;

to the appropriate place in the frontpage css page. That seems to be working. Let me know if I’m going to create any unanticipated problems by doing so. Thanks,

Erick

[nigelmaine Friend nigelmaineJoin date: September 2008Posts: 71Downloads:0Uploads:1 Thanks: 38 Thanked: 3 times in 1 posts]

#297446

What file did you change and which line was it. I am also having problems with resizing on the Front page.

Many Thanks

[edanzer Friend edanzerJoin date: December 2008Posts: 3Downloads:0Uploads:0 Thanked: 1 times in 1 posts]

#297449

Hi,

In ja.news.fp.css, adjust the code for #jazin-hlfirst img. My original solution above created some other formatting issues. So I’ve since adjusted it to look like this:

#jazin-hlfirst img {
margin: 0 0 10px !important;
padding: 0 !important;
max-width: 250px;
height: auto;

I did the same thing with the smaller images that appear in the shorter headline articles with the following:

#jazin-hlnext .jazin-content img {
float: right;
padding: 0;
margin: 5px 0 5px 15px;
width: 125px;
height: auto;

In both cases, the only thing I’ve change from the original is to add the width: and height attributes. That seems to be working well. Good luck. E

1 user says Thank You to edanzer for this useful post

1. nigelmaine

[cgc0202 Friend cgc0202Join date: August 2007Posts: 2244Downloads:0Uploads:3 Thanks: 206 Thanked: 262 times in 1 posts]

#297528

<em>@edanzer 119612 wrote:</em><blockquote>Hi,

In ja.news.fp.css, adjust the code for #jazin-hlfirst img. My original solution above created some other formatting issues. So I’ve since adjusted it to look like this:

#jazin-hlfirst img {
margin: 0 0 10px !important;
padding: 0 !important;
max-width: 250px;
height: auto;

I did the same thing with the smaller images that appear in the shorter headline articles with the following:

#jazin-hlnext .jazin-content img {
float: right;
padding: 0;
margin: 5px 0 5px 15px;
width: 125px;
height: auto;

In both cases, the only thing I’ve change from the original is to add the width: and height attributes. That seems to be working well. Good luck. E</blockquote>

Can you check with browser check site if this will be compatible with Internet explorer, it requires both attributes to be specified.

I think it may run counter to optimization policies. To lay the structure of a page, you need to know the attributes of the components. Without a height, that is not possible, the server system must compute this for you before the area can be assigned.. Thus, in some browsers (please check with IE), it may still load, as you observed. However, it might be slower.. You will observe this as slow loading modules, that will change the size (move the page) once the system has figured out the height,

This is pure speculation though, but I tested a site where I just copied an image from my Flickr site, the image description just gave the width, and that was one of the comments in the optimization — height not specified.

Cornelio

[omar_ali Friend omar_aliJoin date: August 2008Posts: 31Downloads:0Uploads:6 Thanks: 9]

#303844

Hi,

I tried that, however, the text gets larger than the image itself.

[Author]

Posts