Возможна ли маржа для <div>в css? - PullRequest
3 голосов
/ 16 ноября 2010

Можно ли определить поле для текстовой области?

мой редактор wysiwyg помещает мой текст в теги <div> вместо разрыва строки <br />

Итак, я подумал о том, чтобы дать <div> запас?

Возможно ли это в css? и если да, то как?

Большое спасибо.

РЕДАКТИРОВАТЬ: я не могу определить div, потому что он не получает классов. Например, редактор делает это:

<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum egestas lacus libero, et pellentesque nisl. Cras pharetra nunc sit amet urna vestibulum non ultricies metus malesuada. </div>
<div>Nulla tincidunt, neque at blandit ultrices, massa odio pulvinar est, vel accumsan sapien justo sit amet lorem.</div>

Это выглядит так:

Lorem Ipsum Dolor Sit Amet, Concetetur Adipiscing Elit. Vestibulum egestas lacus libero, et pellentesque nisl. Cras pharetra nunc sit amet urna vestibulum non ultricies metus malesuada.
Nulla tincidunt, neque at blandit ultrices, massa odio pulvinar est, vel accumsan sapien justo sit amet lorem.

Но должно быть так:

Lorem Ipsum Dolor Sit Amet, Concetetur Adipiscing Elit. Vestibulum egestas lacus libero, et pellentesque nisl. Cras pharetra nunc sit amet urna vestibulum non ultricies metus malesuada.

Nulla tincidunt, neque at blandit ultrices, massa odio pulvinar est, vel accumsan sapien justo sit amet lorem.

Ответы [ 4 ]

1 голос
/ 16 ноября 2010

Вы можете изменить поля всех <div> s в контейнере, написав

.MyContainer div {
    margin: 42px;
}
1 голос
/ 16 ноября 2010
<div style="margin:5px;">content</div>

... поместит поле в 5 пикселей на div.

1 голос
/ 16 ноября 2010

как:

div.myDiv{
  margin: 10px 0px 5px 20px;
}

дает вам: 10 пикселей сверху, 0 пикселей справа, 5 пикселей снизу и 20 пикселей слева.

0 голосов
/ 16 ноября 2010

<p> уже имеет поле 1em сверху и снизу по умолчанию.Я обычно использую <p>test</p>, чтобы поставить разрывы строк в тексте вместо <br />

. Вы можете поместить 1em верхнее и нижнее поле для всех ваших div в отдельном файле .css, например:

div{
  margin:1em 0; /* 1em top & bottom; 0em sides */
}

Вы не хотели бы использовать встроенный CSS, как кто-то предложил:

<div style="margin:1em 0;">text</div>

, потому что вы используете WYSIWYG, который не вставляет это автоматически.Кроме того, вы должны иметь дополнительный атрибут style="" на всех ваших div.

Одна интересная концепция, которую стоит отметить, это то, что поля сжимаются вертикально, а не горизонтально.Это означает, что если у вас есть поле 1em сверху и снизу, у вас не останется поле 2em между абзацами.Вместо этого вы получите более желательное поле 1em.

W3C Спецификация CSS: блочная модель

В CSS 2.1 горизонтальные поля никогда не сжимаются.

Вертикальные поля могут разрушаться между определенными блоками:

  • Два или более смежных вертикальных поля блоков блоков при нормальном потоке потока
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...