液体布局和边框

发布于 2024-10-17 04:48:28 字数 606 浏览 2 评论 0原文

我遇到液体布局和边框问题,导致元素溢出。

结构有点像这样:

<div id="container">
    <label>Label</label><input type="text' />
</div>

#container{width: 100%;}
label{width: 25%;}
input{width: 75;}

我需要值相加为 100%,以便左右边缘对齐。只有输入上的边框才能有效地设置输入宽度 width: 100% +2px;

仅使用 CSS 有什么方法可以解决此问题吗?

I am having problems with a liquid layout and borders, causing elements to overflow.

The structure is somewhat like this:

<div id="container">
    <label>Label</label><input type="text' />
</div>

#container{width: 100%;}
label{width: 25%;}
input{width: 75;}

I need the values to add up to 100% so the left and right edges align. Only the borders on the input make the input widths effectively width: 100% +2px;

Is there any way around this problem using just CSS?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

哑剧 2024-10-24 04:48:28

负边距

您可以尝试设置负边距:

margin: -1px;

我已经在您的 jsFiddle 上更改了它们,并且文本框确实跳转到了标签右侧。

Negative margins

You can try by setting negative margins:

margin: -1px;

I've changed them on your jsFiddle and textboxes did jump right of label.

欢烬 2024-10-24 04:48:28

已修复:

http://jsfiddle.net/Mutant_Tractor/eRaB5/3/

只需添加

margin: -1px;

to .input-text class.

Fixed:

http://jsfiddle.net/Mutant_Tractor/eRaB5/3/

Just add

margin: -1px;

to .input-text class.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文