0

我以前做过这个，我相信使用填充。这个想法是我想要两个元素（div）并排（浮动），其中具有百分比（100％）宽度，另一个具有（50px）的固定像素。

画得不好的插图：

------------------------------------------------
|              100%             |     50px     |
------------------------------------------------

我不想要以下任何东西

  • javascript
  • 小于 100% 的宽度（如 95% 等）不起作用
4

2 回答 2

1

从您的小提琴看来，您可能已经按照我认为可能是唯一可能的方式解决了它，绝对定位，然后填充以使其有呼吸空间。您知道您可以发布自己的问题答案：D

这是您可能遇到相同问题并直接想要答案的其他人的有效答案代码，无需费力：

HTML

<div class="black">
    <div class="yellow">
    </div>
    <div class="purple">
    </div>
</div>

CSS

.black{background:black;padding-right:70px;height:100px;position:relative;}
.yellow{background:yellow;width:100%;height:100%;}
.purple{background:purple;width:50px;height:100%;margin:0 0 0 20px;position:absolute;right:0;top:0;}
于 2013-01-09T04:11:27.390 回答
1

这里的另一个答案：jsfiddle

#one
{
  width:100%;
  float:right;
}

#two
{
  width:50px;
  margin-right:-100%;
  float:right;
}

这当然是在将 clearfix 解决方案添加到父 div 之后。

这可能不是最符合语义的做事方式，但它确实有效。如果您使用这种方法，我建议您在第一个 div（具有 100% 宽度）中为您的内容添加另一个 div。

于 2013-01-09T04:25:43.447 回答