Home > Article > Web Front-end > The difference between CSS width: 100% and width: auto_html/css_WEB-ITnose
The difference between CSS width: 100% and width: auto_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:42:26886browse
The difference between width: 100% and width: auto
width: auto is smarter. If the margin has taken up 10px of space on the left and right, then the value given by width is 580px.
<style>div{width:600px;overflow:auto;background:#ccc;}p{ width:auto; margin:10px; background:red;}</style></head><body><div> <p>123</p></div></body></html>
If width:100%, it means p The width will be 600px, which will fill the div area, and then it will have margin, so a scroll bar will appear.
div{width:600px;overflow:auto;background:#ccc;}p{ width:100%; margin:10px; background:red;}</style></head><body><div> <p>123</p></div>
are all based on the width of the parent element.
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：CSS3 animation event interface_html/css_WEB-ITnoseNext article：CSS3 animation event interface_html/css_WEB-ITnose