Проблемы с привязкой css урок 39?

0
.header {
	background-color: darkslateblue;
	height: 177px;
	font-size: 0.8em;
	margin-left:0px;
	margin-right:0;
	min-width:900px;
}

.main, .logo, .menubar, .site_content, .footer {
	margin-left: auto;
	margin-right: auto;
}

.logo {
	width:880px;
	padding-bottom:40px;
}

.logo h1, .logo h2 {
	font:normal 300%; 'Century gothic' ,arial, sans-serif;
     margin:0 0 0 9px;
}

.logo_text h1, .logo_text h1 a, .logo_text h1 a:hover {
padding:22px 0 0 0;
color:#fff;
letter-spasing: 01em;
text-decoration:none;
}

.logo_text h2 {
	font-size: 0.9em;
	padding: 4px 0 0 0;
	color: #999;
}

.menubar {
	width: 900px;
	height: 46px;
}

ul.menu {
	float: right;
}

ul.menu li {
	float: left;
	padding: 0 0 0 9px;
	list-style: none;
	margin: 1px 2px 0 0;
}

ul.menu li a {
	font: normal 100% 'trebuchet ms', sans-serif;
	display: block;
	height: 20px;
	padding: 6px 35px 5px 28px;
	color:#fff;
	text-decoration: none; 
}

ul.menu li.selected a {
color: #aeb002;
}

ul.menu li a:hover {
	color: #e4ec04;
}

.site_content {
	width: 880px;
	overflow: hidden;
	margin: 20px auto 0 auto;
	background-color: white;
}

.sidebar_container {
	float: right;;
	widt: 224px;
}

Видео тайминг 2:20 сек - С этого места всё и началось.
В  2 словах - Всё получалось до того момента когда нужно было переименовать в index.html <div class="sidebar_container">

style.css - .sidebar_container {
float: right;;
widt: 224px;

!DOCTYPE html>
<!-- saved from url=(0077)file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html# -->
<html lang="ru"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	
	<title>Document</title>
	<meta name="description" content="Киномонстр это портал о кино">
	<meta name="keyword" content="фильмы, фильмы онлайн, Hd">
	<link rel="stylesheet" type="text/css" href="./index_files/style.css">
	</head>
<body>
		<div class="main">
			<div class="header">
				<div class="logo">
					<div class="logo_text"><h1><a href="file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html">Киномонстр</a></h1>
						<h2>Кино - наша страсть!</h2>
					</div>
				</div>
				<div class="menubar">
				<ul class="menu">
					
					<li class="selected"><a href="file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html#">Главная</a></li><a href="file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html#">
						</a><li><a href="file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html#">Фильмы</a></li>
						<li><a href="file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html#">Сериалы</a></li>
						<li><a href="file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html#">Рейтинг фильмов</a></li>
						<li><a href="file:///C:/Users/zemiel/Desktop/js/kino%20monster/kinomonstersite/index.html#">Контакты</a></li>


				</ul>  

				</div>
			</div>

			<div class="site_content">

			<div class="sidebar_container">
				<div class="sidebar">
					
					<h2>Поиск</h2>
					<form method="post" action="#" id="search_form">
						<input type="search" name="search_field" placeholder="Ваш запрос"/>
						<input type="submit" class="btn" value="найти" />
					</form>
				


				</div>

				

			</div>	

			</div>
	

	    </div>
			

</body></html>

}
Но проделав всё это SIDEBAR  так и не хотел прилипать к правой части. Далее через консоль разработчика в Hrome посмотрел код CSS у элемента  <div class="sidebar_container"></div> - Оказалось  style.css - .sidebar_container не применился. Пришлось руками прописывать в <head><style>.sidebar_container {
float: right;;
widt: 224px;
</style></head> И тогда заработало. I need healp ))

html
css

5 ответов

1

1. Через ctrl и f5 попробуй обновить страницу в браузере, может cache или открой в приватном режиме браузера (режим инкогнито)

2. Подключение к css

<link rel="stylesheet" type="text/css" href="./index_files/style.css">

Лучше пока делать как в уроках, через assets/css/styles.css, а то потом запутаешься и по неопотности будешь с проблемами сталкиваться, как сейчас.

Кстати, можно исходный код скачать, разархивировать его, запустить, потом сравнить со своим кодом. В исходном коде все работает, сам так делал, потом сравнивал со своим кодом.

0

Разместил полностью оба файла index & css.

0

Ну шо ! Комьюнити )))
Сдулись!!! Не уж то всё гладко...

0

Спасибо ! Помогла корректива href="./index_files/style.css"> на href="assets/css/style.css">

И о чудо ! Никаких багов. sideadbar таки ушел в право! 

0

Нужно код полностью показать и html и css

Sign up or Log in to write an answer