<!DOCTYPE html>

@dukesov · Регистрация: 24.08.2015

Author24 — интернет-сервис помощи студентам

Использую фреймворк Bootstrap для сайта. Сейчас более-менее стал разбираться в php, уже на создавал много страниц, сделал админку, но не суть важно.
А важно вот что.
Сегодня узнал о <!DOCTYPE html>.
До этого он прописан у меня не был. Я его прописал и началось... Страница сужается до предела (если мало контента) (footer начинает находится на середине страницы).
В самом фреймворке ничего не менял, немного добавил своих стилей (они не мешают), есть несколько своих стилей на странице, но они этому тоже не мешают.
Подключил reset.css, не помогает

CSS

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
 
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
 
/* HTML5 display-role reset for older browsers */
 
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
   display: block;
}
 
body {
line-height: 1;
}
 
ol, ul {
list-style: none;
}
 
blockquote, q {
quotes: none;
}
 
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
 
table {
border-collapse: collapse;
border-spacing: 0;
}

Прописал выше head вот такое:

CSS

<style type="text/css">
<!--
html, body {
    margin:0;
    height:100%;
}
-->
</style>

И о чудо! Отображается нормально.
Кто подскажет мне, почему с дополнительным стилем страница не каверкается, при всем при этом фреймворк сам говорит прописать:

HTML5

<!DOCTYPE html>
<html lang="en">
  ...
</html>

Спасибо!

Добавлено через 6 минут
И еще заметил. с ПК с браузера google chrome отображает нормально, а на iPhone с Safari, footer чуть поднялся (между footer-ом и низом страницы пустое пространство примерно 5мм.)

@PticaOgnennaya · 21.01.2016, 16:18

Могу предположить, что есть разница в стилях по умолчанию в определяемой браузером версии до и версии html 5...

@Анар · 21.01.2016, 16:44

dukesov, для того, чтобы вырасти нормальным веб-разработчиком надо сперва учиться всё делать руками, а потом только использовать фреймворки типа бутстрапа. В таком случае у вас бы не было проблем подобной этой, когда вы по первом теге html'я узнали после "стал разбираться в php" и "уже на создавал много страниц", а так же непонимание почему сайт, у которого не задана ширина, сужается без контента.
Начните с изучения html и css, причём начните с изучения html4/xhtml.

 - это комментирование у html, а у css они выглядят вот так /* */. Так же в html5 указывать тип стиля не нужно.

@Fedor92 · 21.01.2016, 17:51

dukesov, вёрстка в которой не указан доктайп, интерпретируется броузером в режиме совместимости... Это корень всех проблем, почитав по ссылке статью, поймёте, что происходит с Вашей вёрсткой... А вот когда поймёте можете начинать править страницы, которые уже наверстали...

@serikus · 21.01.2016, 21:02

Я пользуюсь:

PHP

<?php 
<-- все мои нужные скрипты -->
 
?>
 
<!DOCTYPE html>
<html lang="lv">
  <head>
<title>title</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
 
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
 
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script></head>
<body>
<div class="row">...</div>
<div class="col-lg-4 col-md-3 col-sm-2 col-xs-1">...</div>
// Если надо что то вывести в хтмл
<?php echo $string ?>
</body>
</html>

У меня все мои веб-скрипты крутятся по такому принципу. Никаких проблем ни на моб., ни на планшетах, ни на ПК

@newJS · 22.01.2016, 06:25

Все правильные doctype и запрещенные в них HTML теги
Полезные ресурсы для web-мастера

Сначала нужно научиться писать на чистом html+css. ИМХО

@dukesov · 22.01.2016, 08:29 **[ТС]**

Всем большое спасибо!

<!DOCTYPE html>

Решение

Решение

@PticaOgnennaya 8 / 8 / 3 Регистрация: 18.04.2014 Сообщений: 56
	21.01.2016, 16:18	2
	Могу предположить, что есть разница в стилях по умолчанию в определяемой браузером версии до и версии html 5... 0

@Анар 225 / 216 / 89 Регистрация: 12.09.2015 Сообщений: 986
	21.01.2016, 16:44	3
	dukesov, для того, чтобы вырасти нормальным веб-разработчиком надо сперва учиться всё делать руками, а потом только использовать фреймворки типа бутстрапа. В таком случае у вас бы не было проблем подобной этой, когда вы по первом теге html'я узнали после "стал разбираться в php" и "уже на создавал много страниц", а так же непонимание почему сайт, у которого не задана ширина, сужается без контента. Начните с изучения html и css, причём начните с изучения html4/xhtml. <!-- --> - это комментирование у html, а у css они выглядят вот так /* */. Так же в html5 указывать тип стиля не нужно. 1

@Fedor92 2964 / 2599 / 1068 Регистрация: 15.12.2012 Сообщений: 9,876 Записей в блоге: 11
	21.01.2016, 17:51	4
	Сообщение было отмечено dukesov как решение Решение dukesov, вёрстка в которой не указан доктайп, интерпретируется броузером в режиме совместимости... Это корень всех проблем, почитав по ссылке статью, поймёте, что происходит с Вашей вёрсткой... А вот когда поймёте можете начинать править страницы, которые уже наверстали... 1

@newJS 2435 / 1114 / 312 Регистрация: 23.06.2011 Сообщений: 3,525
	22.01.2016, 06:25	6
	Сообщение было отмечено dukesov как решение Решение Все правильные doctype и запрещенные в них HTML теги Полезные ресурсы для web-мастера Сначала нужно научиться писать на чистом html+css. ИМХО 1

@dukesov 19 / 18 / 11 Регистрация: 24.08.2015 Сообщений: 471
	22.01.2016, 08:29 [ТС]	7
	Всем большое спасибо! 0