Joomla Templates Club 406,261 posts

[lovedigit Friend lovedigitJoin date: September 2011Posts: 235Downloads:22Uploads:41 Thanks: 13 Thanked: 14 times in 3 posts]

#205134

Images bigger than the specific size breaks the single article view on firefox. See screenshot. How to fix that? I cannot edit all the images on the 3k+ articles.

---

Attachments:

1. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#565129

Hi lovedigit,

You can try with this tweak:
– Go to file: /templates/ja_teline_v/css/custom.css
– Add this rule:


article img, .article-intro img, .article-content img {
width: 100%;
}


[lovedigit Friend lovedigitJoin date: September 2011Posts: 235Downloads:22Uploads:41 Thanks: 13 Thanked: 14 times in 3 posts]

#565134

Thanks! it worked like a charm 🙂

[lovedigit Friend lovedigitJoin date: September 2011Posts: 235Downloads:22Uploads:41 Thanks: 13 Thanked: 14 times in 3 posts]

#565135

Can you look at this one as well? – http://www.joomlart.com/forums/topic/fix-gallery-image-height/

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#565136

You’re welcome!!!

[lovedigit Friend lovedigitJoin date: September 2011Posts: 235Downloads:22Uploads:41 Thanks: 13 Thanked: 14 times in 3 posts]

#568802

Hello, after applying the code. all the images in the article are stretched to fit the width. I don’t want that to happen to all of the images.

I have found the alternative code that can be implemented. but, I am not sure what should I use to make it work for all display resolutions? I could use the % value for max-width attribute. but that too I don’t really know how to use.

.article-content-main
{
max-width: value;
}
seems to be good approach for this problem. Can you help me further on this one?

---

Attachments:

1. 

[lovedigit Friend lovedigitJoin date: September 2011Posts: 235Downloads:22Uploads:41 Thanks: 13 Thanked: 14 times in 3 posts]

#733895

Hello, after applying the code. all the images in the article are stretched to fit the width. I don’t want that to happen to all of the images.

I have found the alternative code that can be implemented. but, I am not sure what should I use to make it work for all display resolutions? I could use the % value for max-width attribute. but that too I don’t really know how to use.

.article-content-main
{
max-width: value;
}
seems to be good approach for this problem. Can you help me further on this one?

[lovedigit Friend lovedigitJoin date: September 2011Posts: 235Downloads:22Uploads:41 Thanks: 13 Thanked: 14 times in 3 posts]

#568803

Nevermind. I answered my own question

This code works perfectly. Just put it in custom.css:

.article-content-main {
max-width: 100%;
}

[lovedigit Friend lovedigitJoin date: September 2011Posts: 235Downloads:22Uploads:41 Thanks: 13 Thanked: 14 times in 3 posts]

#733896

Nevermind. I answered my own question

This code works perfectly. Just put it in custom.css:

.article-content-main {
max-width: 100%;
}

[Andrew Winkler Friend Andrew WinklerJoin date: September 2014Posts: 725Downloads:206Uploads:31 Thanks: 291 Thanked: 34 times in 2 posts]

#570402

Sorry, I tried both ways, but it made no difference.

https://therebel.is/news/rebelofoz/849635-about-the-significance-of-old-stories

[Andrew Winkler Friend Andrew WinklerJoin date: September 2014Posts: 725Downloads:206Uploads:31 Thanks: 291 Thanked: 34 times in 2 posts]

#735468

Sorry, I tried both ways, but it made no difference.

https://therebel.is/news/rebelofoz/849635-about-the-significance-of-old-stories

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#570405

You can try with my suggestion above:


.article-content img {
width: 100%;
}


1 user says Thank You to Saguaros for this useful post

1. Andrew Winkler

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#735471

You can try with my suggestion above:


.article-content img {
width: 100%;
}


1 user says Thank You to Saguaros for this useful post

1. Andrew Winkler

[Author]

Posts