S1egh4rdt
@S1egh4rdt
Вот я тип

Как в Bootstrap3 Navbar выровнять кнопку с отступом от правого края в 2 столбца?

С тем кодом, что у меня есть, кнопка "Личный кабинет" выровнена просто по правому краю, а мне надо сделать отступ от этого края в 1 или в 2 столбца. Как это осуществить?
Прилагаю листинг:
<!DOCTYPE html>
<html lang="ru">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>ЯРГА</title>

		<!-- Bootstrap CSS -->
		<link href="http://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
		<link href="weidmanns.css" rel="stylesheet">

		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
			<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
			<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->
	</head>
	<body>
		<header>
			<nav class="navbar navbar-default top" role="navigation">				
				<div class="container-fluid">
					<div class="col-md-2"></div>
					<div class="navbar-header">
						<a class="navbar-brand" rel="home" href="#" title="Buy Sell Rent Everyting">
        		<img style="max-width:150px; margin-top: -7px;"
             src="D:\Sieggikods\JaRGA\image\logo.png"></a>
					</div>
					<div class="col-md-1"></div>
					<form class="navbar-form navbar-left" role="search">
			      <div class="form-group">
			        <input type="text" class="form-control" placeholder="Поиск по сайту">
			      </div>
			      <button type="submit" class="btn btn-custom">Искать</button>
			  	</form>
			  	<!--<div class="col-md-3"></div>-->
          <form class="navbar-form navbar-right col-md-offset-2">
          	<button type="button" class="btn btn-custom">Личный кабинет</button>
          </form>   
          <div class="col-md-2"></div>   
				</div>
			</nav>
		</header>
	</body>
</html>
  • Вопрос задан
  • 925 просмотров
Решения вопроса 1
m5web
@m5web
Python, js
Замени offset на push
col-md-push-2
Если используешь less, то mixin будет выглядеть так:
.your-class {
    .make-md-column-push(2);
}


<div class="col-md-2 col-md-push-2">
  <form class="navbar-form navbar-right">
    <button type="button" class="btn btn-custom">Личный кабинет</button>
  </form>  
</div>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
25 апр. 2024, в 12:20
15000 руб./за проект
25 апр. 2024, в 12:08
300 руб./за проект
25 апр. 2024, в 11:49
25000 руб./за проект