简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > HTML Tutorial > body text

为什么父div没有被撑开_html/css_WEB-ITnose

WBOY
Release： 2016-06-24 11:40:24
Original
1133 people have browsed it

为什么父div没有被撑开:

在正常情况下，如果父对象没有设置高度，子对象能够将子对象撑开，但是如果子对象浮动且没有清除浮动的话，在IE8或者FF浏览器，父对象并不能够被撑开，在IE6下可以撑开。

代码实例: 

<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">.parent{  border:1px solid red;  width:500px;}.first,.second{  float:left;  height:100px;  width:100px;  border:1px solid blue}</style></head><body><div class="parent">  <div class="first"></div>  <div class="second"></div></div></body></html>
Copy after login

以上代码在IE6下可以撑开父div，但是在IE8或者FF浏览器下不能够被撑开。解决方法就是清除浮动。代码如下: 

<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.51texiao.cn/" /><title>蚂蚁部落</title><style type="text/css">.parent{  border:1px solid red;  width:500px;  overflow:hidden}.first,.second{  float:left;  height:100px;  width:100px;  border:1px solid blue}</style></head><body><div class="parent">  <div class="first"></div>  <div class="second"></div></div></body></html>
Copy after login

原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0519/1891.html

最原始地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=4699

Related labels：
为什么父div没有被撑开
source：php.cn
Previous article：为什么padding和margin在span中不好用_html/css_WEB-ITnose Next article：CSS如何将边框设置为虚线_html/css_WEB-ITnose
Statement of this Website
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
Latest Articles by Author
Latest Issues
Title rewritten as: HTML element height does not reach 100% coverage I want this element to cover 100% of the screen height, apparently it doesn't do that, is ...
From 2023-09-15 08:52:48
0
1
261
How to prevent the converted elements from overflowing and automatically cutting them off? I'm using Bootstrap4 to make a modal gallery for a friend's personal website. I set it up ...
From 2023-09-07 20:04:02
0
1
290
How to overlay an image with text with rounded background I need to replicate in HTML what you see in this image: The problem is that the text is co...
From 2023-08-30 15:20:14
0
1
192
The PHP code is not executed, but the code is displayed in the browser source code I try to execute some PHP code on the project (using Dreamweaver) but the code is not runn...
From 2023-08-23 16:04:27
0
2
313
Mysql slow query log content viewing problem The slow query log is enabled in mysql, but I often see such a query in the log. I don’t k...
From 2017-06-28 09:23:21
0
2
750
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！