@alan31

Почему одинаковый css и html работают по разному на разных страницах?

У меня есть header на странице
<div class="cont">
	<div class="header">
		<a href='#' class="logo">Logo</a>
		<div class='header_r'>
			<nav class="h_menu">
				<ul>
					<li><a class='newspage' href='news.html'>News</a></li>
					<li><a class='mainpage' href='main.html'>Main</a></li>
					<li><a class='saved' href='saved.html'>Saved</a></li>
				    <li><a class='myg' href='mygroups.html'>My groups</a></li>
					<li><a class='createg' href='#'>Create group</a></li>
				</ul>
			</nav>
			<div class="h_search_block">
				<img class='h_lupa' src="icons/lupa3.png" alt="">
				<input placeholder='Global search...' class='h_search' type="text">
			</div>
			<a href='#' style='height: 27px;'class="login">Log In</a>
		</div>
	</div>
</div>

И его css:
*{
	margin: 0;
	padding: 0;
	font-family: 'Rubik', sans-serif;
	text-decoration:none;
	list-style:none;
}

body{
	background:#E5EBF1;
	overflow-x:hidden;
}

.middle{
	display:flex;
	justify-content:center;
	padding-top: 20px;
	width: 100% !important;
	height: 100%;
	background-image:url("../fon.jpg");
	background-size:cover;
	background-repeat:repeat-y; 
}


.header{
	background:white;
	width:100%;
	height:45px;
	display:flex;
	box-shadow: 0 0 10px #E5E5E5;
	position:relative;
}

.h_left{
	display:flex;
	position:absolute;
	left: 0;
}

.header_r{
	display:flex;
	position:absolute;
	right: 100px;
}

.logo{
	color:#5260E5;
	font-size:30px;
	margin-left: 10px;
	margin-top: 3px;
}

.h_menu{
	padding-top:10px;
}

.h_menu ul{
	display:flex;
}


.h_menu a{
	font-size:20px;
	margin-left:40px;
	white-space:nowrap;
}

.myg{
	color:#444444;
}

.createg{
	color:#444444;
}

.mainpage{
	color:#5260E5;
}

.saved{
	color:#444444;	
}

.newspage{
	color:#444444;
}

.h_menu a:hover{
	color:#5260E5;
}

.h_search_block{
	position:relative;
	margin-left:3.5%;
	margin-right:3.5%;
}

.h_search{
	width:272px;
	background:#E5EBF1;
	height:25px;
	margin-top:4px;
	outline:none;
	padding:5px 18px 5px 40px;
	font-size:14.5px;
	color:grey;
	font-family: 'Noto Sans TC', sans-serif;	
	border:none;
}


.h_lupa{
	position:absolute;
	width:20px;
	z-index:3;
	left:10px;
	top:12.5px;	
}


.login{
	font-size:20px;
	margin-top:10px;
	color:#444444;
	white-space:nowrap;
}

.login:hover{
	color:#5260E5;
}


Все работает хорошо , но дело в том , что когда я вставляю этот же код на другую страницу , мой header уменьшается , а также увеличивается ширина самой html страницы , будто мой header не вмещается , хотя опять же этот код работал корректно на другой странице
  • Вопрос задан
  • 96 просмотров
Пригласить эксперта
Ответы на вопрос 2
В таком виде, как представлено, всё отображает совершенно одинаково.
Ответ написан
Shull
@Shull
хочу быть хорошим IT-шником
Значит, на этой странице есть что-то ещё. Или же эта страница отображается при помощи другой страницы.
Стоп. Проверьте масштаб в браузере.
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы