Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 05.09.2011, 22:01
Аспирант
Отправить личное сообщение для romantik2011 Посмотреть профиль Найти все сообщения от romantik2011
 
Регистрация: 20.07.2011
Сообщений: 50

Не срабатывают стили
Как сделать чтоб вот так отображало на всех браузерах, что-то не выходит.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Основы блочной верстки (Div верстки)</title>
<!--<link href="style.css" rel="stylesheet" type="text/css"> -->
<style type="text/css">
*{margin:0px; padding:0px; border:0px; font-family:Arial, Helvetica, sans-serif;}
html>body  #header {margin:0px auto; width:800px; background-color:#FFCC99;}
html>body #left{margin-top:40px; background-color:#FFFFCC; width:35%; float:left; text-align:center;
border-left:1px solid black; border-right:1px solid black;}
html>body  #kontent{background-color:white; text-align:center;  border:1px solid black; border-collapse:collapse;}
html>body  #footer{text-align: center; background-color:#CC9966;}
</style>
</head>
<body>
<div id="header"><span style="font-size:34px;">М</span>
<div id="left">Menu</div>
<div id="kontent">Главная страница</div>
<div id="footer">Copyright © Филип Киркоров <? echo date('Y'); ?></div>
</div>
 </body>
</html>


Только в Опере отображает так, в гуглхром и мозиле наезжает.
Изображения:
Тип файла: jpg clip_image002.jpg (10.9 Кб, 7 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 05.09.2011, 22:14
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Основы блочной верстки (Div верстки)</title> 
<!--<link href="style.css" rel="stylesheet" type="text/css"> -->
<style type="text/css"> 
*{margin:0px; padding:0px; border:0px; font-family:Arial, Helvetica, sans-serif;} 
#wrapper {width:800px; margin: 0 auto 0 auto; text-align: center;}
#header {background-color:#FFCC99;} 
#left{background-color:#FFFFCC; width:35%; float:left; text-align:center; 
border:1px solid black;} 
#kontent{padding-left: 35%; background-color:white; text-align:center;  border:1px solid black;} 
#footer{text-align: center; background-color:#CC9966;} 
</style> 
</head> 
<body> 
    <div id="wrapper">
        <div id="header"><span style="font-size:34px;">М</span></div>
        <div id="left">Menu</div> 
        <div id="kontent">Главная страница</div> 
        <div id="footer">Copyright © Филип Киркоров <? echo date('Y'); ?></div> 
    <div>
 </body> 
</html>
Ответить с цитированием
  #3 (permalink)  
Старый 05.09.2011, 22:23
Аспирант
Отправить личное сообщение для romantik2011 Посмотреть профиль Найти все сообщения от romantik2011
 
Регистрация: 20.07.2011
Сообщений: 50

Скажите, а что вы именно сделали такое что заработало?
Ответить с цитированием
  #4 (permalink)  
Старый 05.09.2011, 22:25
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Ну дык сравните со своим кодом, и увидите разницу
Ответить с цитированием
  #5 (permalink)  
Старый 05.09.2011, 22:42
Аспирант
Отправить личное сообщение для romantik2011 Посмотреть профиль Найти все сообщения от romantik2011
 
Регистрация: 20.07.2011
Сообщений: 50

От этого все стало на места?
margin: 0 auto 0 auto;

Если написать 1 раз 0 auto margin = 0 и элемент над которым это действие производилось становится по центру
Двойное такое написание что означает?
0 auto 0 auto
Почему 2 раза, а не один раз 0auto
Ответить с цитированием
  #6 (permalink)  
Старый 05.09.2011, 22:46
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

ну привычка у меня писать все четыре значения, хотя для этого случая можно просто 0 auto
Ответить с цитированием
  #7 (permalink)  
Старый 05.09.2011, 23:39
Аспирант
Отправить личное сообщение для romantik2011 Посмотреть профиль Найти все сообщения от romantik2011
 
Регистрация: 20.07.2011
Сообщений: 50

Я заметил вы взяли моего id="header" ещё в один див id="wrapper", а в хидера можно сделать или ещё в один блок нужно обязательно?
Ответить с цитированием
  #8 (permalink)  
Старый 06.09.2011, 09:30
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,134

devote, если добавить контента в левую или правую части - 2-хколоночного макета не получится.
Ответить с цитированием
  #9 (permalink)  
Старый 06.09.2011, 09:31
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,134

Полная каша.

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
*{margin:0px; padding:0px; border:0px; font-family:Arial, Helvetica, sans-serif;} 
#wrapper {width:800px; margin: 0 auto 0 auto; text-align: center;}
#header {background-color:#FFCC99;} 
#left{background-color:#FFFFCC; width:35%; float:left; text-align:center; 
border:1px solid black;} 
#kontent{padding-left: 35%; background-color:white; text-align:center;  border:1px solid black;} 
#footer{text-align: center; background-color:#CC9966;} 
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div id="wrapper">
	<div id="header"><span style="font-size:34px;">М</span></div>
	<div id="content"></div> 
	<div id="left">
		<p>Menu</p>
		<p>Menu</p>
		<p>Menu</p>
		<p>Menu</p>
		<p>Menu</p>
		<p>Menu</p>
		<p>Menu</p>
		<p>Menu</p>
	</div> 
	<div id="kontent">
		<p>Главная страница</p>
		<p>Главная страница</p>
		<p>Главная страница</p>
		<p>Главная страница</p>
	</div> 
	<div id="footer">Copyright © Филип Киркоров <? echo date('Y'); ?></div> 
<div>
</body>
</html>
Ответить с цитированием
  #10 (permalink)  
Старый 06.09.2011, 09:33
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от ksa
devote, если добавить контента в левую или правую части - 2-хколоночного макета не получится.
Ну если говорить о том что будет и т.д. то придеться еще много чего править и дописывать... Человек попросил что бы одинаково работало везде... Я ему сделал... что будет дальше... Ему виднее.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как поменять тег элемента, не меняя его ID, стили и т.п. ? Solovei95 Общие вопросы Javascript 1 14.08.2011 12:47
Стили в пхп не пашут Kasperskiy Серверные языки и технологии 3 01.05.2011 23:03
стили Css в зависимости от высоты активной области браузера Vladimir_Kl Javascript под браузер 3 23.03.2011 16:04
При отправке страницы на печать е подключаються стили! Что посоветуете! bozeak Общие вопросы Javascript 3 07.12.2009 18:04
Как при наведении на один объект изменять стили других? greysells jQuery 4 06.12.2009 11:00