Фотографии Донецк, Киев, Москва
...
 
 

FAQ html, css, java-script, ssi

 

margin и padding

margin - это расстояние от внутренней границы внешнего элемента (например, окна, ячейки, дива...) до внешней границы внутреннего элемента.

padding - это расстояние от внутренней границы элемента до содержимого.

  margin  
  padding  
    text text text text    
       
       

Синтакис:

тег {
  margin-top: значение;
  margin-bottom: значение;
  margin-left: значение;
  margin-right: значение;

  padding-top: значение;
  padding-bottom: значение;
  padding-left: значение;
  padding-right: значение; }

Значение - число в px, %, em

Как разместить рисунок слева от текста без таблицы

Принцип: помещаем в div картинку с align="left" и текст с отступом от левого края шириной в размер картинки плюс еще некоторое расстояние на «просвет»:

<div>
	<p><img ... align="left"></p>
	<p style="padding-left:60px">Bla bla ...</p>
</div>

Результат:

1

Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla


1

Bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla


Если текстовки меньше, чем высота картинки, то, в случае нескольких подобных лент, чтобы не налазило друг на друга, играемся со свойством clear:

<div>
	<p><img ... align="left"></p>
	<p style="padding-left:60px">Bla bla ...</p>
</div>

<p style="clear:both"><hr></p>

<div>
	<p><img ... align="left"></p>
	<p style="padding-left:60px">Bla bla ...</p>
</div>

Результат:

1

Bla bla bla bla


1

Bla bla bla bla


 

...

Немного о Донецке

Донецк. Каким ты был и каким стал
Фотографии Донецка: каким город был и каков он сейчас
 
Донецк. Скифская аллея
Скифская аллея
бульвар Пушкина, Донецк
 
Есть вопрос? Задайте!
  • ...
 
 
 
 
Стикер
...