我有一个非常简单的问题,但我似乎无法解决它。 我在div中有一个表,这是主要元素。 现在我在表格中有一个td标签,其宽度和高度设置为iphone屏幕尺寸。 现在我基本上希望将该表与其div标签中的td单元居中,这样“屏幕”将在任何浏览器窗口中居中。 我怎么做?
用表替换div解决了我的问题,但我想用div代替。
谢谢
This question already has an answer here:
How to horizontally center a <div>? 101 answersI have a very simple problem, but I can't seem to solve it. I have a table inside a div, which is the main element. Now I have a td tag inside the table with a width and hight set to that of an iphone screen size. Now I basically want to center that table with its td cell within the div tag, so that the 'screen' will be centered in any browser window. How do I do that?
Replacing that div with a table solved my problem, but I would like to use a div instead.
Thank You
最满意答案
尝试这个,我做这个代码 - 在这里演示 ,非常简单和简单的代码(我已经使用黑客代码和额外的跨度标签只有IE老版本) http://jsfiddle.net/ERuX4/1/
<div class="demo wraptocenter"> <span></span> <img src="http://www.spitzer.caltech.edu/images/twitter.png?1295473781" alt="" /> </div>CSS
.wraptocenter * { vertical-align: middle; } .wraptocenter span { display: inline-block; height: 100%; width: 1px; } .wraptocenter { display: table-cell; text-align: center; vertical-align: middle; } /*End wraptocenter - image Vcenter patch styles*/ .demo { width:100px; height:100px; border:1px solid red; position:absolute; top:50%; left:50%; margin-top:-100px; margin-left:-100px;}Try this one , I do this code - Demo here, Very easy and simple code ( I have used a hack code and extra span tag for only IE old version) http://jsfiddle.net/ERuX4/1/
<div class="demo wraptocenter"> <span></span> <img src="http://www.spitzer.caltech.edu/images/twitter.png?1295473781" alt="" /> </div>css
.wraptocenter * { vertical-align: middle; } .wraptocenter span { display: inline-block; height: 100%; width: 1px; } .wraptocenter { display: table-cell; text-align: center; vertical-align: middle; } /*End wraptocenter - image Vcenter patch styles*/ .demo { width:100px; height:100px; border:1px solid red; position:absolute; top:50%; left:50%; margin-top:-100px; margin-left:-100px;}更多推荐
div,td,table,电脑培训,计算机培训,IT培训"/> <meta name="description"
发布评论