无线电输入的异常间隔

时间:2014-03-13 23:56:35

标签: html css

好的,所以我已经尝试了几个以前的SO答案,但仍然没有运气

Radio buttons and label to display in same line

Documentation on <FIELDSET> <LABEL> tags instead of using TABLE's?

Keep radio buttons with their labels on line breaks

有一些奇怪的事情正在迫使我的收音机出现一些异常行为。希望得到一些帮助/指导,我可以做些什么来解决这个问题!任何帮助表示赞赏。

现场演示:http://iam.colum.edu/students/jordan.max/web-template(2)/index.html

main.html中

<div id="container">

    <form action="welcome_get.php" method="get">
        <p class="textHeader"><strong> First Name </strong></p>
        <input name="firstname" type="text" oninvalid="invalidFName(this);" oninput="invalidFName(this);" placeholder="First Name" required />

        <p class="textHeader"><strong> Last Name </strong></p>
        <p> </p>
        <input id="lastName" type="text" oninvalid="invalidLName(this);" oninput="invalidLName(this);" name="lastName" placeholder="Last Name" required />

        <p class="textHeader"><strong> Email </strong></p>
        <input id="emailaddress" type="email" oninvalid="invalidEmail(this);" name="emailaddress" placeholder="anything@example.com"  required />

        <fieldset>
            <div class="some-class">
                <input type="radio" class="radio" name="x" value="y" id="y" />
                <label for="y">Thing 1</label>
                <input type="radio" class="radio" name="x" value="z" id="z" />
                <label for="z">Thing 2</label>
            </div>
        </fieldset>

        <input type="submit" value="Submit" id="submitButton" />

    </form>

</div>

CSS

1 个答案:

答案 0 :(得分:0)

样式表中包含以下内容:

#container input, #container select, #container textarea {
    width: 450px;
    border: 1px solid #CEE1E8;
    margin-bottom: 20px;
    padding: 4px;
}

width: 450px;正在抛弃你的无线电领域的布局。您可以尝试在该语句之后添加类似的内容以覆盖无线电:

#container input[type=radio] {
    width: auto;
}