Rumah >hujung hadapan web >html tutorial >让3个DIV并排，但是要让中间的DIV居中，旁边2个平均分配剩余宽度_html/css_WEB-ITnose
让3个DIV并排，但是要让中间的DIV居中，旁边2个平均分配剩余宽度_html/css_WEB-ITnose
- WBOYasal
- 2016-06-21 09:47:401928semak imbas
我现在想让3个DIV并排，这个我知道用style:float,但是我还有一个要求就是，中间的一个DIV有固定宽度，比如1200px。高度无所谓，就100%，然后除去这个1200px所占的宽度，根据剩余的宽度，平均分配给剩下的2个DIV。效果相当于让中间的DIV居中，但是旁边的2个DIV要宽度一样。如何实现？
左
中间
回复讨论(解决方案)
只见过两边固定，中间自适应的，还没有见过中间固定，两边自适应的布局呢。
你这估计得要js实现了吧。
计算浏览器文档的宽度，减去中间的固定宽度，再平分到两边的模块中去。
如果浏览器窗口的宽度小于中间的模块宽度，那两边的模块不就没有了？？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><div style=" float:left">左</div><div style=" width:1200px; float:left; text-align:center;">中间</div><div style=" text-align:right;">右</div></body></html>
中间固定宽度 1200px
左
中间
右
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：浏览器样式问题_html/css_WEB-ITnoseArtikel seterusnya：网页怎样随着浏览器的左右拉伸仍然保持居中_html/css_WEB-ITnose