图片在chrome,safari中都可以自动缩小，但在firefox，IE9中无法自动缩小_html/css_WEB-ITnose

因为要在手机上能够访问，测试时就把浏览器的窗口缩到最小；
在safari中如图：



在firefox中就是：


图片和文字都没有完全显示出来；

html和css如下：

<img  class="img-responsive"    style="max-width:90%" src="img/sdlc.jpg" style="float:right;" alt="图片在chrome,safari中都可以自动缩小，但在firefox，IE9中无法自动缩小_html/css_WEB-ITnose" >

img-respinsive的样式：

display:block;max-width:100%;height:auto

请问该如何解决呢

回复讨论(解决方案)

调整父容器宽度试下

调整父容器宽度试下

它的宽度好像是自动获取的，调了没用呢

或者试试html5，根据浏览器宽度不同，使用不同样式；不过要求浏览器，必须支持Html5；
类似于下面的响应式布局；

<style type="text/css">    content div {        border: 1px black solid;    }    @media screen and (max-width: 320px) {        #below320 {            background-color: red;        }    }    @media screen and (min-width: 320px) and (max-width: 800px) {        #between320to800 {            background-color: red;        }    }    @media screen and (min-width: 800px) and (max-width: 1280px) {        #between800to1280 {            background-color: red;        }    }    @media screen and (min-width: 1280px) {        #pass1280 {            background-color: red;        }    }</style>

把 max-width:100% 改成 width: 100%

这些浏览器就不会在手机上用啊

去掉宽度就好了

把 max-width:100% 改成 width: 100%

嗯，这个试了试，不行；

这些浏览器就不会在手机上用啊

要考虑到这方面的，这不，今天为了测试，专门在手机上下了个firefox；

去掉宽度就好了

去掉宽度的话，图片就按它原大小显示了，也不缩小了；

或者试试html5，根据浏览器宽度不同，使用不同样式；不过要求浏览器，必须支持Html5；
类似于下面的响应式布局；

<style type="text/css">    content div {        border: 1px black solid;    }    @media screen and (max-width: 320px) {        #below320 {            background-color: red;        }    }    @media screen and (min-width: 320px) and (max-width: 800px) {        #between320to800 {            background-color: red;        }    }    @media screen and (min-width: 800px) and (max-width: 1280px) {        #between800to1280 {            background-color: red;        }    }    @media screen and (min-width: 1280px) {        #pass1280 {            background-color: red;        }    }</style>

我不是专门做前端的，你说的不太懂哦，我再试试，实在不行，就换种布局和方式；

把 max-width:100% 改成 width: 100%

嗯，这个试了试，不行；

你去掉width="250" 了么？

你去掉width="250" 了么？

去掉了也不行；涉及width的，无论绝对还是相对，都试了试，不行；
难道和bootstrap也有关系，不过换了种方式；

这个应该是可以的。

如果不行，可能是受其他什么影响。

那我需要看更多代码了。

这个应该是可以的。

如果不行，可能是受其他什么影响。

那我需要看更多代码了。

可是在chrome，safari，opera和国产的浏览器中都没问题，就firefox和IE有问题；