"Правильный" синтакс HTML-разметки
 

Натолкнулсо на довольно интересную задачу.
Надобно корректно написать код. Чтобы типпа он не был навален в одну кучу, без переносов строк.

Т.к. вначале, скажем, было
<div><img src="img1.jpg"/><img src="img2.jpg"/></div>

после [url=http://ctrlq.org/beautifier/]бьютифаера[/url] (т.е. при корректной разметке) получилось уже вот так
<div>
   <img src="img1.jpg"/>
   <img src="img2.jpg"/>
</div>

Но на странице в браузере появились визуальные различия рендеринга этих кодов.
В первом, неформатированном варианте, картинки лежать вот так:
|=||=| (т.е. впритык друк к друку)
а во втором вот так
|=| |=|
т.е. между ними промежуток (пробел).

Вопрос: как правильно форматировать хтмл-разметку?
Получается, если мы зафигачиваем в коде инлайновые элементы с новой строки, то они рендерятся с пробелами.

Т.е. получается, инлайновые должны итти без новых строк?
А если у инлайнового будет изменение стиля display? Или наоборот, у блочного элемента будет изменяться (даже динамически) свойство display?
Тогда как поступать?

Получается, визуализация до и после корректной разметки разная. Хренпойми, йоуптель. =))

Прям завалили ответами. =))
Хорошо что есть [url=http://go2dad.com/c3RhY2tvdmVyZmxvdy5jb20vcXVlc3Rpb25zLzE0NjMwMDYxL2NvcnJlY3QtaHRtbC1tYXJrLXVwLXN5bnRheA]стэковерфлоу[/url].
В общем, solved. =)

2-Сайты >
прикол в том, что код надо будет "показывать", и надо чтобы он был "human readable".
Решение, можно сказать, нашол: сделать так, чтобы то что видим, было читаемым, а то что копируем в буфер - сбитым (и, ессно задать это в опциях просмотра кода).