划分在tableheader中的同一行 [英] Divs on same line in tableheader in
本文介绍了划分在tableheader中的同一行的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
以下代码在Internet Explorer中在同一行上显示两个div的诀窍：
< html&
< head>
< meta http-equiv =content-typecontent =text / html; charset = ISO-8859-1>
< style>
th
{
border：0px solid;
font：12px / 1.3Lucida Grande，Arial，sans-serifw;
font-weight：bold;
padding-left：5px;
padding-right：5px;
background：lightgrey;
clear：both;
width：70px;
}
.thspan
{display：inline;
float：left;
word-wrap：break-word;
margin-right 25px;
}
.bspan
{display：inline;
float：right;
width：auto;
}
< / style>
< / head>
< body>
< table>
< th>
< div class =bspan>< button id =text2>< / button>< / div>
< div class =thspan> text1dskjsdkjfsd-sdfdsf< / div>
< / th>
< / table>
< / body>
< / html>
但现在它不适用于Chrome和Firefox ...任何人都知道为什么？ p>
感谢
解决方案
添加margin-right，删除浮动并将显示更改为块
> .thspan {
display：block;
word-wrap：break-word;
margin-right：20px;
}
The following code does the trick for showing two divs on the same line in Internet Explorer:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style>
th
{
border: 0px solid;
font :12px/1.3 "Lucida Grande", Arial, sans-serifw;
font-weight: bold;
padding-left: 5px;
padding-right: 5px;
background :lightgrey;
clear :both;
width: 70px;
}
.thspan
{ display: inline;
float :left;
word-wrap: break-word;
margin-right 25px;
}
.bspan
{ display: inline;
float: right;
width: auto;
}
</style>
</head>
<body>
<table>
<th>
<div class="bspan"><button id="text2"></button></div>
<div class="thspan">text1dskjsdkjfsd-sdfdsf</div>
</th>
</table>
</body>
</html>
But now it doesn't work in Chrome and Firefox... Anyone an idea why?
Thanks
解决方案
Try change the . thspan lie below
Add margin-right, get rid of the float and change display to block
.thspan {
display: block;
word-wrap: break-word;
margin-right: 20px;
}
这篇关于划分在tableheader中的同一行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
