如何垂直中心Facebook的行iframe
问题描述:
这个代码最新怎么了?我无法使用任何样式将它垂直居中。我希望它使用样式attribut而不是修改css。如何垂直中心Facebook的行iframe
<iframe src="https://www.facebook.com/plugins/like.php?href=https://www.facebook.com/KOMPAScom&layout=button" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:47px; height:20px"></iframe>
继承人当我尝试风格attribut:
<iframe style="display: inline-block; vertical-align: middle;" src="https://www.facebook.com/plugins/like.php?href=https://www.facebook.com/feednews.id&layout=button" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:47px; height:20px"></iframe>
答
裹的iframe在一个div,并设置与文本对齐风格:中心。
<div style="width:100%;text-align:center">
<iframe src="about:blank" style="border:none; overflow:hidden; width:47px; height:20px;"></iframe>
</div>
请注意,您在同一元素中也有两个样式语句。其中只有一个将被考虑在内。
答
<div id="d" style="position:relative;width:500px;height:500px;border:solid blue;">
<iframe style="position:relative;top:50%;left:50%;transform:translate(-50%,-50%);border:solid red;" src="https://www.facebook.com/plugins/like.php?href=https://www.facebook.com/feednews.id&layout=button" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden" id="fb"></iframe>
</div>