2 baidu 34197758 baidu_34197758 于 2016.04.01 08:33 提问

用li设置登录表单时,登录和注册按钮已设定float:left;,可是注册按钮和登陆按钮不能在同一行

部分代码如下:
#left li{
list-style-type: none;
float: left;
margin: 0px 0px 5px 0px;
width: 100%;
}
#login{
width: 188px;
height: 100px;/*设定高度,字体大小,影响是否所有li加起来高度超过这个高度*/
background-color: ghostwhite;
font-size: 12px;
border: 1px solid lawngreen;
}
#left #login ul{
margin: 5px 0px 0px 5px;
}
#left #title01{
font-size: 14px;
text-align: center;
font-weight: bold;
color: darkcyan;
background-color: wheat;
height: 16px;
width: 192px;
padding-top: 5px;
padding-bottom: 3px;
}
.btn1{
float: left;
border: 1px solid sandybrown;
margin-left: 32px;
width: 55px;
height: 25px;

        }
          .btn2{
            margin-left: 13px;
            border: 1px solid sandybrown;
            width: 55px;
            height: 25px;
             float: left;

        }
        css
        <body>
        <div id="main">
        <div id="left">
        <ul>
            <li >
                <div id="title01">用户登陆</div>
                <div id="login">
                    <form id="form1" method="post" action="">
                    <ul id="box1">
                        <li><b>账号:</b><input id="username" type="text"/></li>
                        <li><b>密码:</b><input id="userpassword" type="password"/></li>   
                        <li><input id="submit" type="submit" value="登陆" class="btn1"/></li>
                        <li><input id="reg" type="submit" value="注册" class="btn2"/></li>
                    </ul>
                </div>
                </div>
                </form>
            </li>
        </ul>
        </body>

1个回答

lml_little
lml_little   2016.04.01 09:23
已采纳

你的li设置了宽度100%,去掉100%外,你设置的大小小于图片说明2个按钮的宽度,要把.btn1里面的margin-left去掉。

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!