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币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
jsp 界面注册、登录按钮的实现
一个登陆页面,登陆按钮是通过表单来实现,注册按钮是通过button实现的。<input type="button" value="注册" onClick="window.location.href='register.jsp'"> (在当前页面打开reg.jsp) <input type="button" value="注册" onclick="javascript:location.href='r
html登陆按钮和注册按钮
/** * 注册 */ function regist() { // 如果需要在新窗口打开注册界面; // window.open('Untitled-2.html'); // 如果需要在当前窗口打开登录界面 window.location.href = 'Untitled-2.html'; }
解决键盘遮挡注册或登录按钮
简单的几行代码解决键盘遮挡登录或注册按钮 在项目开发中,这种情况是十分常见的,尤其是在登录界面,登录按钮经常被键盘挡住,导致用户输入完账号之后需要关闭键盘,然后再输入密码,然后再关掉键盘,点击登陆。十分繁琐,一旦用户输入错误,就要重复上述步骤。 今天的这个小案例,就是一次性解决键盘遮挡问题,动态的计算,登陆按钮显示需要的高度,进而滚动布局,使之每次输入,键盘都无法遮挡输入框以及按钮
html如何给登录按钮换样式
!DOCTYPE html> .but{border:0px; width: 500px; height:756px; background-image:url(img/t0140da96332c5f8c5b[1].jpg); font-size:30px; color
【已解决】【Selenium】请教大神,知乎的注册页面如何切换到登录页面?
xpath可以 之前的xpath写错了 -----------------------------------分割线------------------------------------------------- 之前运行一直都挺正常,所以也没发现这个问题。 这两天打开知乎网站:https://www.zhihu.com/signup?next=%2F 直接进入了注册界面  
Android-键盘遮挡登录或注册按钮
简单的几行代码解决键盘遮挡登录或注册按钮 在项目开发中,这种情况是十分常见的,尤其是在登陆界面,登陆按钮经常被键盘挡住,导致用户输入完账号之后需要关闭键盘,然后再输入密码,然后再关掉键盘,点击登陆。十分繁琐,一旦用户输入错误,就要重复上述步骤。 今天的这个小案例,就是一次性解决键盘遮挡问题,动态的计算,登陆按钮显示需要的高度,进而滚动布局,使之每次输入,键盘都无法遮挡输入框以及按钮。 先来一张效果图
css实现登录注册可切换页面与boostrap按钮组
1、设置login_box .login-box { width: 420px; height: 408px; padding: 20px; background-color: #fff; } 2、设置login-tabs,底部设置灰色边框 .login-box .login-tabs { font-family: tahoma, arial, 'Hiragino San
登录,注册,个人信息,退出的隐藏和出现
先上效果图 1.未登录之前,隐藏个人信息和退出 2.登陆后,隐藏登陆和注册按钮,显示用户头像 3.点击头像,显示下拉列表 先上jquery代码//注册,登录,个人信息,退出按钮的隐藏和出现 $('#member, #logout').hide(); if ($.cookie('username')) { $('#member,#logout').sho
点击“登录”或者“注册”按钮,出一个“登录”或者“注册”对话框给你填写,后面置灰
js:         无标题页                   function   showMydiv()           {                 document.body.scroll="no";                 if(window.screen.Height> =document.body.scrollHeight)              
点击登录按钮弹出登录层(HTML+JS)
由于审美的需要,我们常常要实现点击某个特定的登陆按钮,然后弹出相应的登陆框。今天我也来分享一下…… 本例子非常简单,说白了就是对JQuery的应用。就看你的熟练程度了。本例子只在追求相关功能的实现。界面布局神马的不在范围之内。 先看源码:     登录               用户名                           密码