作者：nancy_liu_tj | 来源：互联网 | 2023-02-12 11:18
我正在尝试使用flexbox将两个图像放在一列中.在这种情况下,widthdiv容器的小于width图像的容器.在Chrome中,图像完全适合div容器,但它不在IE中,我不知道为什么.
div.outer {
width: 400px;
display: flex;
flex-direction: column;
justify-content: space-around;
}
div.inner {
width: 100%;
border: 1px solid red;
}
img {
width: 100%;
height: auto;
}
1> andreas..：
IE11似乎在flex-shrink属性的初始值上有些麻烦.如果将其设置为零(最初设置为1),它应该工作:
div.outer {
width: 400px;
display: flex;
flex-direction: column;
justify-content: space-around;
}
div.inner {
flex-shrink: 0;
width: 100%;
border: 1px solid red;
}
img {
width: 100%;
height: auto;
}
推荐阅读
-
本文详细介绍了从用户在浏览器中输入一个域名（如www.yy.com）到页面完全展示的整个过程，包括DNS解析、TCP连接、请求响应等多个步骤。 ...
[详细]
蜡笔小新 2024-11-12 18:13:16
-
本文探讨了网络爬虫引发的问题及其解决方案，重点介绍了Robots协议的作用和使用方法，旨在为网络爬虫的合理使用提供指导。 ...
[详细]
蜡笔小新 2024-11-13 15:45:41
-
-
在Eclipse中提升开发效率，推荐使用Google V8插件以增强Node.js的调试体验。安装方法有两种：一是通过Eclipse Marketplace搜索并安装；二是通过“Help”菜单中的“Install New Software”，在名称栏输入“googleV8”。此插件能够显著改善调试过程中的性能和响应速度，提高开发者的生产力。 ...
[详细]
蜡笔小新 2024-11-10 09:44:34
-
在PHP中实现腾讯云接口签名，以完成人脸核身功能的对接与签名配置时，需要注意将文档中的POST请求改为GET请求。具体步骤包括：使用你的`secretKey`生成签名字符串`$srcStr`，格式为`GET faceid.tencentcloudapi.com?`，确保参数正确拼接，避免因请求方法错误导致的签名问题。此外，还需关注API的其他参数要求，确保请求的完整性和安全性。 ...
[详细]
蜡笔小新 2024-11-08 21:58:28
-
C++ 开发实战：实用技巧与经验分享 ...
[详细]
蜡笔小新 2024-11-07 20:31:03
-
前端时间因为项目需要，要对一个产品下所有的附属图片进行分页显示，没考虑ajax一张张请求，所以干脆一次性全部把图片out，然 ...
[详细]
蜡笔小新 2024-11-12 14:58:57
-
本文详细介绍了如何解决 Windows Server 2016 在使用无线网络 (WLAN) 和有线网络 (以太网) 时遇到的连接问题。包括添加必要的功能和安装正确的驱动程序。 ...
[详细]
蜡笔小新 2024-11-12 00:01:44
-
DVWA学习笔记系列：深入理解CSRF攻击机制 ...
[详细]
蜡笔小新 2024-11-11 13:19:51
-
在Webdriver中，元素定位是自动化测试的关键环节。本文详细介绍了8种常用的元素定位技术与策略，包括ID、名称、标签名、类名、链接文本、部分链接文本、XPath和CSS选择器。每种方法都有其独特的优势和适用场景，通过合理选择和组合使用，可以显著提高测试脚本的稳定性和效率。此外，文章还探讨了在复杂页面结构中如何灵活运用这些定位技术，以应对各种挑战。 ...
[详细]
蜡笔小新 2024-11-11 11:34:38
-
本文探讨了如何利用爬虫技术抓取目标网站的数据，并结合Fiddler和Postman工具在Chrome浏览器中的应用，优化数据提交流程。通过详细的抓包分析和模拟提交，有效提升了数据抓取的效率和准确性。此外，文章还介绍了如何使用这些工具进行调试和优化，为开发者提供了实用的操作指南。 ...
[详细]
蜡笔小新 2024-11-09 09:05:16
-
技术日志：使用 Ruby 爬虫抓取拉勾网职位数据并生成词云分析报告 ...
[详细]
蜡笔小新 2024-11-07 14:33:19
-
通过点击页面右侧的“预览”按钮，您可以直接在当前页面查看效果，或点击链接进入全屏预览模式。该视频教程展示了如何使用纯 CSS 实现按钮两侧滑入装饰元素的悬停效果。视频内容具有互动性，观众可以实时调整代码并观察变化。访问以下链接体验完整效果：https://codepen.io/comehope/pen/yRyOZr。 ...
[详细]
蜡笔小新 2024-11-07 14:24:29
-
Java环境中Selenium Chrome驱动在大规模Web应用扩展时的性能限制分析 ...
[详细]
蜡笔小新 2024-11-07 10:10:30
-
通过合理利用Hackbar插件，可以显著提升网页调试的效率。本文介绍了如何获取并使用未包含收费功能的2.1.3版本，以确保在不升级到最新2.2.2版本的情况下，依然能够高效进行网页调试。此外，文章还提供了详细的使用技巧和常见问题解决方案，帮助开发者更好地掌握这一工具。 ...
[详细]
蜡笔小新 2024-11-06 15:41:47
-
本文推荐了七款高效的编辑器与笔记工具，并详细解析了KindEditor的自动换行功能。其中，轻笔记QingBiJi是一款完全免费的记事本软件，用户可以通过其简洁的界面和强大的功能轻松记录和管理日常事务。此外，该软件还支持多平台同步，确保用户在不同设备间无缝切换。 ...
[详细]
蜡笔小新 2024-11-06 11:14:53
-
nancy_liu_tj
这个家伙很懒，什么也没留下！
京公网安备 11010802041100号