Question

2 div s. HTML 和 CSS 仅。

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

第二个第(div)项的标题就在那里,预期的位置是复选框,但不是复选框。

Why aren t the second div s check boxes in the same area?
(They more under the first divs, to the left....?)

非常感谢任何帮助。

JsFiddle 中的代码: < a href="http://jsfiddle.net/GregMcNulty/2mQ7k/"rel="nofollow" >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

您有您的 divs < code> inline 我怀疑您实际想要的是 < code> 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;                
        }

< a href=" "http://jsfiddle.net/stFLC/6/" rel = "no follow" >FIDDLE

友情链接