单选按钮不是内联的

时间:2017-06-28 04:22:28

标签: css

我有3个带有margin-top的css属性的单选按钮:-27px;这导致2单选按钮在主标签标题上方移动,而另一个单选按钮在单选按钮标签旁边并且在单选按钮的主标签下方正确。如何限制或强制其他2个单选按钮不超过一定限制并与第3个单选按钮保持相同的高度线。

2 个答案:

答案 0 :(得分:0)

很难理解你完全在谈论什么。正如其他人所指出的那样,如果您需要最好的帮助,则需要发布代码。

但是,如果您想尝试对齐3个单选按钮,可以将它们包装在div中并将各个元素设置为内联。

所以这是你的元素:

<div class="wrapper">
    <input type="radio" class="inline-button">
    <input type="radio" class="inline-button">
    <input type="radio" class="inline-button">
</div>

你可以这样设计:

.wrapper {
    width: auto;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
}
.inline-button {
    display:inline-flex;
}

答案 1 :(得分:0)

很难理解您的问题。我认为您需要这个。这会为您提供一些帮助。

.test-class {display:inline !important; margin:5px !important}

将此类用于与div相关的主要单选按钮。希望对您有帮助!