水平对齐多个表格?
我想要多个水平表格。它可以在 Firefox 中运行,但不能在 Chrome 中运行。有什么想法吗?
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color:#000000;}
table {border:1px solid #FFFFFF; float:left;}
tr, td {background-color:#000000; border:1px solid #00000;}
</style>
</head>
<body>
<table id="t1">
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="text" /></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="text" /></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
</table>
<table id="t2">
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="text" /></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
I want multiple tables horizontally. It works in Firefox, but not Chrome. Any ideas?
<!DOCTYPE html>
<html>
<head>
<style>
body {background-color:#000000;}
table {border:1px solid #FFFFFF; float:left;}
tr, td {background-color:#000000; border:1px solid #00000;}
</style>
</head>
<body>
<table id="t1">
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="text" /></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="text" /></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
</table>
<table id="t2">
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="text" /></td>
</tr>
<tr>
<td><input type="text" /></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我刚刚检查了 Chrome,它工作正常
http://jsfiddle.net/Svbz2/
I just checked in Chrome, it's working fine
http://jsfiddle.net/Svbz2/
为了使浮动属性发挥作用,您通常需要指定要浮动的对象的宽度。试试这个:
In order for the float property to work, you'll usually need to specify the width of the object you're trying to float. Try this:
我不明白 chrome 怎么会不喜欢这个。是否需要使用多个表?也许您应该根据此页面的目的填写所需的额外文本。更好的方法可能是使用 DIV (定义页面上的部分)或 UL (无列表样式的无序列表),但同样,不知道什么这个页面正在做。
I don't see how chrome wouldn't like this. Is it necessary to use multiple tables? Maybe you should of filled that required extra text with the purpose of this page.. A better approach could be to use DIV (to define sections on the page) or UL (unordered list with no list-style) but again, no idea what this page is doing.