Question

2 div。仅限HTML和CSS。

在CSS中指定第二个div位于第一个div的右侧。

第二个div的标题在那里，预期但不是它的复选框。

为什么第二个div的复选框不在同一区域？
（他们更多的是在第一个div，在左边......？）

非常感谢任何帮助。

JsFiddle中的代码：http://jsfiddle.net/GregMcNulty/2mQ7k/

<html>
    <head>
        <style type="text/css">
            #checkbox1
            {
                display:inline;
                position:relative;
                top:1in;
                left: .5in;                              
            }
            #checkbox2
            {
                display:inline;
                position:relative;
                top:1in;
                left: 1.5in;                
            }   
        </style>    
    </head>
<body>   

      <form>

        <div id="checkbox1">
            Please select the Clamps you are interested in:
        </div>

        <div id="checkbox2">
            Please select the Revets you are interested in: <br />
            <input type="checkbox" name="Solid" /> Solid <br />
            <input type="checkbox" name="Cherry" /> Cherry lock <br />
            <input type="checkbox" name="PopRivets" /> PopRivets <br />
            <input type="checkbox" name="Rivnuts" /> Rivnuts <br />
            <input type="checkbox" name="Huck" /> Huck Clinch
        </div>


    </form>

</body>
</html>

Answer 1

你有你的div inline我怀疑你真正想要的是inline-block，也垂直对齐它们以便它们具有所需的对齐。

        #checkbox1
        {
            display:inline-block;
            vertical-align:top;
            position:relative;
            top:1in;
            left: .5in;                              
        }
        #checkbox2
        {
            display:inline-block;
            vertical-align:top;
            position:relative;
            top:1in;
            left: 1.5in;                
        }

FIDDLE

显示带有内嵌复选框的2个div？

1 个答案: