Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Is not working with Views when using Grid format. This problem just happens with Firefox.
Anyone can help please?
Comments
Comment #1
Ralf Eisler CreditAttribution: Ralf Eisler commentedI have the exact same problem not only with Firefox but also with Opera.
Comment #2
shanefjordan CreditAttribution: shanefjordan commentedHaving the same issue.
I rewrote the template for the view grid format to use a "div" in place of the table, tr, and td tags. This allowed for the images to be adaptive.
I then wrote some CSS to float each of my column divs to the left. This broke adaptive images again.
Comment #3
shanefjordan CreditAttribution: shanefjordan commentedThe adaptive image will not work when it is added to any type of table. This could be a table created from Views with the format set to Table or Grid. This also occurs when an adaptive image is added to a standard table in the body of a node.
In a node body, add a table that is 100%. Then, add text to the table cell - this will scale properly.
In a node body, add a table that is 100%. Then, add an image and make it adaptive - this will not scale.
Any ideas?
Thank you,
Shane
Comment #4
shanefjordan CreditAttribution: shanefjordan commentedTo make adaptive images work within a table, they need to be in a block element. The style max-width does not work with inline elements.
To make this work for a view with grid style, I am using the following code:
Hope this helps.
Thanks,
Shane
Comment #5
n1k CreditAttribution: n1k commentedThis can be fixed via css. #4 should work for you.
Comment #6
paul_constantine CreditAttribution: paul_constantine commentedSorry to reopen this.
But for a lack of a good gallery for D7 I've been using a homemade gallery with a custom template (see below).
As you can see it uses a table.
So whenever I tried using the apaptive image in the display settings of my gallery node the image in the teaser was displayed in its original size in Firefox, thus breaking the layout.
It worked very well in Safari and Chrome and on my iPhone, just not in Firefox. At first I thought it was a Firefox problem, until I found this threat.
Unfortunately my CSS skills are somewhat meager. I did manage to insert some custom CSS into the propper place inside the SKY-Settings. Only the above example is for a views grid and not for a normal table.
How would that CSS look for a notmal table like my mini-gallery?
Comment #6.0
paul_constantine CreditAttribution: paul_constantine commentedmore info
Comment #7
Jedd Casella CreditAttribution: Jedd Casella commentedThis problem is so annoying. It can be fixed with this line of CSS
Comment #8
realgiucas CreditAttribution: realgiucas commented#7 solves the problem
Comment #9
iambarbara CreditAttribution: iambarbara commentedThe following code worked for me. I removed some stuff from the code in #4:
Comment #10
Seraphemme CreditAttribution: Seraphemme commented#4 worked perfectly. Thank you Shanefjordan!
Comment #11
Seraphemme CreditAttribution: Seraphemme commented#4 worked perfectly. Thank you Shanefjordan!