Responsive-images is the part of Responsive Web Design (RWD) dealing specifically with images on the web to provide optimal experiences across a wide range of devices based on screen size, platform, and orientation.
Questions tagged [responsive-images]
518 questions
0
votes
1 answer
Controlling Height of Neighbouring DIV to IMG tag
I have an image of a fixed aspect ratio, but of responsive format, as the first item in a two column flex row, as follows:
Sammy
- 3,395
- 7
- 49
- 95
0
votes
2 answers
Squish table to make it responsive css
I want to make my table responsive for the application i am using. I have tried all different approach like making it scroll as the window size decreases. But i want to have a approach where the table squeezes or squishes to fit the size of the…
prb_cm
- 117
- 1
- 4
- 13
0
votes
1 answer
Create responsive image tag with only low res content
How can we construct a responsive image tag to insure that the browser chooses the image with the lowest file size that will fill its container, rather than choosing a higher resolution version?
I'm building a website with many images per page. We…
hommealone
- 23
- 7
0
votes
1 answer
Responsive image resolution iPhone vs iPad
I want to use srcset to provide 2x images for iPhone and iPad, but the 2x descriptor applies to both and the images should be different.
On both devices the image is full width. But on iPhone 2x of 320w is 640w and on iPad Pro 2x of 1024 is…
gabdara
- 486
- 3
- 10
0
votes
1 answer
Responsive for image problems in CSS coding
I am doing responsive work on my website and using cover image. But I am getting in '' tag, not a CSS file. So the image does not fit when I am doing responsive work.
I set the width to 100% and height to auto. But even so, the image does not fit…
aalicenk
- 13
- 1
- 7
0
votes
1 answer
Compressed YouTube Default Image
YouTube videos have different resolution default thumbnails to use. We use the "default" version (ie: http://img.youtube.com/vi/UNIQUECODE/default.jpg) to preview youtube videos before showing them.
The problem is that Google PageSpeed then dings…
Stech
- 33
- 7
0
votes
2 answers
How do I make 3 images which span across the width of the site responsive?
So I would like to have 3 images along the full width of the website, each of them acting as 1/3. I would like them to be responsive and scale accordingly on different screen sizes and have them maintain aspect ratio, any ideas how I would go about…
PinkieBarto
- 19
- 1
- 6
0
votes
1 answer
DFP Responsiveness in Bootstrap
I just joined doubleclick for publishers and want to show responsive ad units without mapping specific sizes.
I want to apply a class like img-responsive where I fix the width and let the height adapt.
I know there are many questions but I'm looking…
Techy
- 2,026
- 4
- 20
- 41
0
votes
1 answer
Cannot get srcset to load correct image
I'm using the HTML below & testing using Chrome but no matter the width of the browser (when using the responsive dev tools) the 150x150 image is always loaded. If I was understanding it correctly I thought when the browser width is under 150px it…
Neil Nand
- 549
- 6
- 25
0
votes
1 answer
Securing and Optimizing Angular 2 Image URLs
I'm building an angular 2 website where only authenticated users can access content. Some of this content is peoples photos, to which access must be restricted to authenticated users only. Furthermore, these images should be delivered in an…
Sammy
- 3,395
- 7
- 49
- 95
0
votes
0 answers
2 responsive background images, one div inside the other
I have the following div with a background image and another div with a background image. They need to stay together in the same configuration when responsive. I have an auto scroll on hover the inside image. All done with CSS. However, I'm using…
Greg
- 11
- 1
- 6
0
votes
3 answers
Bootstrap Grid Layout on Mobile Devices
I am trying to create a Bootstrap grid layout with different images. Everything is fine except when viewing on different mobile devices in the mobile inspector on Chrome. Below is a picture of what it looks like in the inspector. The second image…
user5124826
0
votes
1 answer
Responsive images srcset not behaving as expected
I am trying to implement a full screen responsive image solution with the following loose requirements
0-600px > displays small image
601-900px > displays medium image
901-2000px > displays large image
After a bit of digging, I decided to work with…
sygad1
- 1,392
- 3
- 12
- 19
0
votes
3 answers
0
votes
4 answers
How to use image as background in element based resposive layout?
I am trying to use an image of a guy on the left hand side of my layout. but in smaller screens it looks stretched. I have tried to use following background properties:
background: rgba(0, 0, 0, 0) url("../images/login.png");
background-size: 100%…
Nomi Khurram
- 101
- 1
- 11