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
0 answers
alt text temporarily displayed before picturefill.js renders the correct image
I'm trying to setup picturefill.js to deliver responsive images. When I use the srcset attribute instead of the src attribute to avoid a double download, the default images alt text is consistently showing up before picturefill.js has a chance to…

Kevin
- 335
- 4
- 17
0
votes
3 answers
How to keep an image full window, centred and responsive within ratio?
I am trying to figure out how this website here
has made the responsive header image that fills the window size onload and resizes with the window resize while still filling the window in it's original ratio.
This is what I have come up with so far…

Beno
- 127
- 1
- 8
0
votes
2 answers
Banner image being clipped, not showing as full browser width
I had a programmer code a page for my site, but when we migrated the code to my site (on Shopify), some of the things stopped working. I've been able to fix almost everything, but the top banner is still giving me trouble.
I want it to fill the full…

Brie
- 11
- 1
- 2
0
votes
0 answers
How do I create a responsive background image?
I'm trying to make my background images responsive and it seems to work ok on desktops, but it's messing up on mobile. Specifically the iPhone 6 Plus according to my boss.
Here's my code:
min-height: 500px; /* different height for different sections…

DevonAero
- 75
- 1
- 6
0
votes
2 answers
Responsive images only scale on browser refresh
Hi I am having a problem with an responsive image gallery using jQuery cycle.
My fiddle is here - https://jsfiddle.net/qxyodctm/5/
See jsfiddle
You will see only when you refresh the browser the images resize and constrain their…

roshambo
- 2,624
- 6
- 31
- 54
0
votes
1 answer
How to set multi select file in Responsive filemanager
I' using Responsive filemanager http://www.responsivefilemanager.com
I want to multiple selection image file but i dont know config
This is the my code html
0
votes
1 answer
Bootstrap 3 way of laying out 8 images in a row
I have eight 640x480 images. It might fluctuate one or two, and I want them evenly distributed & centered on a row.
IIUC an iPhone 6 has a screen of 1334x750. So I expect at least two 640x480 images on a row. However since the screen has a "high…

hendry
- 9,725
- 18
- 81
- 139
0
votes
1 answer
Images cut off in older android browser
I'm working on a responsive design and have made the images' code as such - looks great on Chrome, Firefox, and Safari.
img {
max-width:100%;
width:100%;
}
However, on the old Android browsers, v2.3.4, it doesn't work and the images are cut…

greatwanderer
- 72
- 1
- 10
0
votes
1 answer
Using jCrop with CamanJs not working for Responsive Image
I am using CamanJs (a image manipulation tool) to edit my current image and I have integrated jCrop with the CamanJs for cropping purpose following
http://v2-demos.jcrop.org/demos/camanjs.html this source.
It's working fine but problem is that, it…

murad
- 175
- 2
- 14
0
votes
2 answers
How to create a div in the same size as the contained image. Both should be responsive
I am creating a mobile e-mail template (means no javascript) which has to be responsive.
I want to place several images inline, which are scaled down as the screen gets narrower. I did this by using css table and table-cell, and let the image scale.…

David
- 105
- 1
- 8
0
votes
2 answers
How do I set a responsive proportional image that is relative to its own height – NOT its width
How do I set a responsive proportional image that is relative to its own height – NOT its width?
simply setting...
img{
width: auto;
height: 100%;
}
doesn't give me proportional dimensions for my image.
How can I do that?

Quinn Keaveney
- 1,248
- 1
- 17
- 39
0
votes
1 answer
Why sizes attribute in img tag as we can use media query with image container instead?
OK this is the case : we want to display image in 50% of view port when viewport size is 800px or more otherwise image is 100% so the html look like the following:-

user1592671
0
votes
1 answer
responsive HTML images using width and height values in image tag
Currently my website is setup where the full image that is in it is loaded then automatically sized to fit the screen. This is done by setting image width to 100% in CSS. While it does work nicely, It doesn't seem to follow standards because I don't…

Mike -- No longer here
- 2,064
- 1
- 15
- 37
0
votes
1 answer
Bootstrap - how to center a div from right left top and bottom?
Using Bootstrap - how can I center a div from right, left, top, and bottom, plus be able to make picture responsive?
I tried this:
#logo{
position:absolute;
top: 50%;
left: 50%;
width:500px;
height:200px;
margin-top: -100px;…

Tal Malka
- 18
- 5
0
votes
2 answers
How to fill a div with an image and still be responsive?
I'm trying to make an image gallery with different images and different sizes. I have included a link to an image to explain what I want. I have made a row with 4 divs which each contains an image. The images have a width and an height. But my…
user5415197