有没有办法将包含YMDW按钮的第一个div固定在左侧,并且在屏幕放大时不移动?
并且在YMDW div和输入框div之间添加一些空间。
我是新手,它已经花了我几天时间。
预先谢谢你
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid">
<h1>Hello World!</h1>
<p>Resize the browser window to see the effect.</p>
<div class="row">
<div class="col-1 col-xs-3 col-sm-2 col-md-2 col-lg-2 form-inline">
<input type="button" class="btn btn-grey300_rsd pull-right float-right" value="Y" data-viewid="view_yearly">
<font class="pull-right float-right"> </font>
<input type="button" class="btn btn-grey300_rsd pull-right float-right" value="M" data-viewid="view_monthly">
<font class="pull-right float-right"> </font>
<input type="button" class="btn btn-blue900_rsd pull-right float-right" value="W" data-viewid="view_weekly">
<font class="pull-right float-right"> </font>
<input type="button" class="btn btn-grey300_rsd pull-right float-right" value="D" data-viewid="view_dayly">
<font class="pull-right float-right"> </font>
</div>
<div class="col-xs-12 col-sm-7 col-md-6 col-lg-5 form-inline">
<input type="text" class="form-control" id="tx_front_dt" style="text-align:center;width:150px;font-weight:bold;">
</div>
<div class="col-lg-3 hidden-md hidden-sm hidden-xs form-inline "> </div>
<div class="col-xs-12 col-sm-3 col-md-4 col-lg-1 clearfix">
<input type="button" id="btn_view_inc_page" class="btn btn-blue900_rsd " value="LOGOUT" data-unit-type="upper" data-num="1"><font> </font>
</div>
</div>
</div>
</body>
</html>
答案 0 :(得分:1)
如果您从按钮中删除“向右拉”和“向右浮动”类,则div将卡在屏幕左侧。
<div class="col-1 col-xs-3 col-sm-2 col-md-2 col-lg-2 form-inline">
<input type="button" class="btn btn-grey300_rsd" value="Y" data-viewid="view_yearly">
<input type="button" class="btn btn-grey300_rsd" value="M" data-viewid="view_monthly">
<input type="button" class="btn btn-blue900_rsd" value="W" data-viewid="view_weekly">
<input type="button" class="btn btn-grey300_rsd" value="D" data-viewid="view_dayly">
</div>