1

我在下面写了一个我遇到问题的例子：

<div class="text1">Text 1</div>
<div class="text2">Text 2</div>

链接：http: //jsfiddle.net/qhoc/SQpdu/5/

Text 1有伪元素，但高度用伪元素高度调整。

要求：

一种。 身高与身高Text 1相同Text 2

湾。按钮中间的红色矩形。

C。文本周围必须有空格

d。一切都必须是position:relative，至少不是，absolute或者fixed因为这只是一个可以放置在任何地方的按钮。

我可以（a）删除padding: 6px 12px;并添加height: 30px;，但我的文本不会在中间，周围有空格，或者（b）在其中添加另一个内部div并Text 1使其成为红色矩形，但我宁愿不添加div。

有没有办法解决这个问题？

更新：我更改了正确的链接并阐明了要求。

4

2 回答 2

1

我不知道你到底想要什么，但试试这个可能会有所帮助

.text1, .text2 {
    width: 200px;
    padding: 8px 12px;
    display:block;
    background-color: gray;
    margin: 5px;
    height:20px;
}
.text1{
    height:28px;
   padding:0px 12px 8px 12px;
}
.text1:before {
    content:"";
    background: red;
    display: block;
    position: relative;
    width: 20px;
    height: 10px;
    left: 110px;
    top: 15px;
}
​

演示

于 2012-10-17T08:25:11.700 回答
0

您使用此样式代码

.text1, .text2{
  width:120px;
  margin:0 auto;
  height:30px;
}
于 2012-10-17T08:14:34.793 回答