当float：left被设置时，将div扩展到最大宽度 [英] Expand div to max width when float:left is set
问题描述
我有类似的东西：
< div style =width：100px; float：left> menu< ; / DIV>
< div style =float：left>内容< / div>
两个花车都是必需的。我希望内容div填充整个屏幕减去菜单的100px。如果我不使用浮动div div完全按照它应该扩大。但是，如何设置浮动时设置？如果我使用某物，比如
style = width：100％
然后内容div获得父级的大小，这是父体的大小，也可以是我尝试过的另一个div，所以它当然不适合菜单的右侧然后显示如下。
希望我已经正确理解了你，看看这个： http://jsfiddle.net/EAEKc/
<！DOCTYPE html>< html lang =en>< head> < meta charset =UTF-8/>带有菜单的< title>内容< / title> <风格> .content .left {float：left;宽度：100px;背景颜色：绿色; } .content .right {margin-left：100px;背景颜色：红色; }< / style>< / head>< body> < div class =content> < div class =left> < p>Flo！< / p> < / DIV> < div class =right> < p为H.为< / p为H. < p为H.该< / p为H. < p为H.什么< / p为H. < p>您正在寻找什么？< / p> < / DIV> < / div>< / body>< / html>
I have something like that:
<div style="width:100px;float:left">menu</div>
<div style="float:left">content</div>
both floats are neccesary. I want the content div to fill the whole screen minus those 100px for the menu. If i dont use float the div expands exactly as it should. But how do i set this when float is set? If i use sth like
style=width:100%
then the content div gets the size of the parent, which is either the body or another div which i also tried, and so of course it does not fit right of the menu and is then shown below.
Hope I've understood you correctly, take a look at this: http://jsfiddle.net/EAEKc/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Content with Menu</title>
<style>
.content .left {
float: left;
width: 100px;
background-color: green;
}
.content .right {
margin-left: 100px;
background-color: red;
}
</style>
</head>
<body>
<div class="content">
<div class="left">
<p>Hi, Flo!</p>
</div>
<div class="right">
<p>is</p>
<p>this</p>
<p>what</p>
<p>you are looking for?</p>
</div>
</div>
</body>
</html>
这篇关于当float：left被设置时，将div扩展到最大宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
