Повесить текст только на кнопку CSS

Question

Повесить текст только на кнопку CSS

0

У меня такой div:

<div></div>

<p></p>

В верхнем div я делаю много добавлений через jquery, поэтому ни на что. Я хочу сохранить этот p ниже этого div. Как это сделать?

pynovice 05 май 2014, в 15:26

Источник

1

р всегда будет под твоим делом.
Tuhin 05 май 2014, в 13:03
0

Оба являются элементами блочного уровня и останутся сложенными друг на друга, если вы не поместите div. В этом случае вы должны очистить этот поплавок.
Davidicus 05 май 2014, в 13:23

Теги:

html

css

3 ответа

0

reaper_unique:

Ты сказал:

div {
    float: left;
    display: block;
}

По умолчанию div является блоком. Кроме того, когда вы плаваете элемент, он становится блоком. Поэтому вы можете написать только float: left;

securedeveloper:

Ты сказал:

div 
{ 
   display:inline-block; 
   width:100%; 
}

Не рекомендуется "понижать" элемент (div to inline-block/inline) и отображать: inline-block + width: 100% = display: block

Я думаю, что ясно: оба INSIDE div решат любую проблему:

div:after { content: ''; display: block; width: 100%; clear: both; }

RazvanDH 05 май 2014, в 12:19

0

Я знаю, что div является блоком по умолчанию, но я понимаю возможную путаницу, я удалю ненужный стиль exta. Лично я не слишком люблю «ширину», так как это может помешать стилизации элемента позже в будущем. Что делать, если вы установите фон элемента?
reaper_unique 07 май 2014, в 13:45

0

div 
{ 
   display:inline-block; 
   width:100%; 
}

Теперь это всегда будет

ниже элемента;

Afzal Ahmad 05 май 2014, в 10:38

Ещё вопросы

Оба являются элементами блочного уровня и останутся сложенными друг на друга, если вы не поместите div. В этом случае вы должны очистить этот поплавок.
Я знаю, что div является блоком по умолчанию, но я понимаю возможную путаницу, я удалю ненужный стиль exta. Лично я не слишком люблю «ширину», так как это может помешать стилизации элемента позже в будущем. Что делать, если вы установите фон элемента?

reaper_unique · Accepted Answer · 2014-05-05T10-42-00.000Z

Если вы хотите, чтобы элемент блока div находился ниже элемента p-блока, даже при использовании float: left; например (вот почему вы спрашиваете, я полагаю?):

div {
    float: left;
}

p {
    clear: both;
}

См. Jsfiddle, например, с поплавком: http://jsfiddle.net/tw3G5/1/

Здесь float заставляет блок <p> перемещаться рядом с <div>, но поскольку clear: both; этого не произойдет.

Обратите внимание, что clear применяется только к элементам блока. Вот почему я добавил их явно, чтобы сделать его более понятным. Попробуйте применить display: inline; в блок <p> и посмотреть, что происходит, когда float применяется к блоку <div>.

ТЛ; др

Применить clear: both; чтобы заблокировать элемент, чтобы сохранить его ниже другого элемента блока.

Для получения дополнительной информации: https://developer.mozilla.org/en-US/docs/Web/CSS/clear

Установка margin-top: 0px на p также сработает и не потребует никаких операций с плавающей запятой / очистке.
Я упомянул, что поплавок и дисплеи для примера. Вы можете обойтись без него, главное свойство ясно.