html使用百分比布局怎么保证左右高度相同？

这种情况应该只能结合js来调整了吧。

分别获取左右两栏的高度，对比，得到最高的那栏，将低的一栏设定为高的那栏就好。

js：

var LH = document.getElementById( "left" ).offsetHeight

var RH = document.getElementById( "right" ).offsetHeight

if(LH >RH){

document.getElementById( "right" ).style.height = LH

} else{

document.getElementById( "left" ).style.height = RH

}

但是这个有个弊端，需提前知道各自是否设定了padding值，有设定的话，还得减去该值。

可以使用jq获取padding值的。

jq：

var lh = $("#left").height()//绝对高度，不包括padding-top和pm

var lhpt = $("#left").css('padding-top').replace("px", "")

var lhpm = $("#left").css('padding-bottom').replace("px", "")

var rh = $("#right").height()

var rhpt = $("#right").css('padding-top').replace("px", "")

var rhpm = $("#right").css('padding-bottom').replace("px", "")

var lh2 = lh + lhpt + lhpm

var rh2 = rh+rhpt + rhpm

if(lh2 >rh2){

$("#right").height(lh2 - rhpt - rhpm)

}else{

$("#left").height(rh2 - lhpt - lhpm)

}//就是得计算多个值来比较

您好，你的问题，我之前好像也遇到过，以下是我原来的解决思路和方法，希望能帮助到你，若有错误，还望见谅！加入以下代码，解决你的问题：

1

2

3

4

<p style="margin: 5px auto">step 1挑选宝贝5261</p>

<!-- 可以通过修改margin的值改4102变段落间的间距，例如想变大就1653 margin: 10px auto想变小就 margin: 3px auto -->

<p style="margin: 5px auto">step 2加入购物车</p>

<p style="margin: 5px auto">step 3提交订单 |</p>非常感谢您的耐心观看，如有帮助请采纳，祝生活愉快！谢谢！

---