Heim > Web-Frontend > HTML-Tutorial > float:left 和 right的问题_html/css_WEB-ITnose

float:left 和 right的问题_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Freigeben: 2016-06-21 09:23:32
Original
1136 Leute haben es durchsucht

<div style="width:1000px; margin:0px auto; ">        <div style="float:left; width:400px; border:1px solid red;">            a        </div>        <div style="float:right; width:500px; border:1px solid red;">            b        </div></div>
Nach dem Login kopieren

为什么我这样的代码把窗体缩小后right的div就下来了?


我想要这样的效果:(浏览器缩小left 和 right都不变型)



回复讨论(解决方案)

奇怪,我这里很正常,没有掉下来

奇怪,我这里很正常,没有掉下来


我自己在另外一个项目正常也没有掉下来,但是在这个项目他就会掉下来,不知道是什么属性的影响!
在这个项目里所有的float:left和right 浏览器的窗体缩小都会掉下来的

可是浏览器原因?

可是浏览器原因?


用的是同一个浏览器

你用的说明浏览器??连IE都很正常啊


可是浏览器原因?


用的是同一个浏览器


哪会不会是之前一些定位什么的影响了这里的布局,你clear一下



可是浏览器原因?


用的是同一个浏览器


哪会不会是之前一些定位什么的影响了这里的布局,你clear一下


clear也是一样的,只要在这个项目下的float:left 和right浏览器到某程度就会变形,浏览器最大化是没问题的

body给个最小宽度试试

说错,应该是容器div。或者给容器加 overflow-x:auto;

说错,应该是容器div。或者给容器加 overflow-x:auto;


overflow是没用的 因为我的内容都不超出,我的大层是1000 里面一个400 一个500。


刚没仔细看,什么浏览器?加 display:inline;试试


刚没仔细看,什么浏览器?加 display:inline;试试


什么浏览器都是这样,但是我在别的项目就不会,就这个项目的float:left和right会掉下来
我都不知道什么原因!



刚没仔细看,什么浏览器?加 display:inline;试试


什么浏览器都是这样,但是我在别的项目就不会,就这个项目的float:left和right会掉下来
我都不知道什么原因!


display:inline;没用么?你用QQ截图确认下两个div的宽度,然后……我也不懂了

<div style="width:100%; border:1px solid red; float:left; ">				<div style="float:left; width:400px; border:1px solid red;">				a			</div>			<div style="float:right; width:500px; border:1px solid red;">				b			</div>	</div>
Nach dem Login kopieren

我这个就窜下来了。可能是嵌套层次上有百分比设置的宽度导致的

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage