Question

文字正在改变我的方框。

这就是我所拥有的：

<div class="BigOne" ></div>
<div class="leftOne" ></div>
 <div class="rightOne">This text is deforming the "leftOne"</div>
</div>

CSS：

  .leftOne    {
    float: left;
    width: 100%;
    height: 100%;
    border: 3px dashed #444;
    border-radius: 7px;
    box-sizing: border-box;
}

  .rightOne    {
    float: left;
    width: 100%;
    height: 100%;
    border: 3px dashed #444;
    border-radius: 7px;
    box-sizing: border-box;
}

如何通过改变左侧div来预设右侧div的文本？

谢谢

Answer 1

我从您的问题和解释中理解，您希望leftOne和rightOne的宽度始终保持相同的大小，而不管BigOne的宽度如何。然后，您希望将宽度更改为50%而不是100%，如下所示：

.leftOne, .rightOne {
    float: left;
    width: 50%; /* Change this to 50% instead of 100% */
    height: 100%;
    border: 3px dashed #444;
    border-radius: 7px;
    box-sizing: border-box;
}

请注意，您可以重构CSS，因为这两个类具有相同的样式。如果要对每个样式应用不同的样式，可以将它们分开。

我还注意到你已将它们的高度都设置为100%。如果希望它们保持相同的高度，则需要指定BigOne类的高度。例如：

.bigOne {
    width: 100%; /*or whatever width you want to set it to */ 
    height: 100px; /*or whatever height you want to set it to */ 
}

另一件事，你在第一行有一个额外的</div>。删除它，你的代码应该工作。

<div class="bigOne">
    <div class="leftOne"></div>
    <div class="rightOne">This text is deforming the "leftOne"</div>
</div>

希望有所帮助。

文字正在改变我的div

1 个答案: