0

Имеется в наличии главный div ему задана ширина допустим в 210px, а в этом диве имеются другие дивы (все они дочерни главному) их режим отображения block, они должны быть резиновыми, а родительский нет. У меня получается, что дочерние дивы наследуют размер родителя переназначать ширину не могу ибо нужна резина, помогите

Пример

#content
{
    margin: 5px;
    background-color: #FFF;
    border: 10px solid #000;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0px 1px 0px 0px #d3d2ce;
    width: 100%;  
}
.topBlock
{
    padding: 5px;
    border: 1px solid #6ca528;
}
<div id="content">
    <div class="topBlock">Просто текст проверка длины №1</div>
    <div class="topBlock">Просто текст где текста больше, проверка длины №1</div>
    <div class="topBlock">Текст проверка длины №3</div>
</div>
2
  • Может не width, а max-width?
    – NeedH8
    5 янв 2016 в 19:41
  • у родителя должна быть определенная ширина, вопрос в потомках, я им писал min-width, но это не работает 0 реакции, а смысл в max-width?
    – MaximPro
    5 янв 2016 в 19:42

2 ответа 2

-1

Я нашел такое решение

#content
{
    margin: 5px;
    background-color: #FFF;
    border: 10px solid #000;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0px 1px 0px 0px #d3d2ca;
    width: 100%;
}
.topBlock
{  
    float:left;
    padding: 5px;
    border: 1px solid #6ca528;
    clear:both;
}
#content:after
{  
    content:"";
    display: block;
    clear:both;
}
-1

#content
{
    margin: 5px;
    background-color: #FFF;
    border: 10px solid #000;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0px 1px 0px 0px #d3d2ca;
    width: 100%;  
}
.topBlock
{
    padding: 5px;
    border: 1px solid #6ca528;
    display: block;

}
<div id="content">
    <div>
      <div class="topBlock">Просто текст проверка длины №1</div>
    </div>
    <div>
      <div class="topBlock">Просто текст где текста больше, проверка длины №1</div>
    </div> 
    <div>
      <div class="topBlock">Текст проверка длины №3</div>
    </div>
</div>
8
  • обновил, там видно что блоки растягиваются под всю длину родителя а должны только под свой текст
    – MaximPro
    5 янв 2016 в 19:39
  • совсем не то, нужно чтобы размер дочерних элементов растягивался динамически под их содежимое, а вы предлагаете это заранее определить
    – MaximPro
    5 янв 2016 в 19:47
  • тут либо js задействовать, либо переопределять .topBlock в inline-block либо inline. так как блочный элемент по умолчанию наследует размеры родителя.... а сторочный контента..
    – pepel_xD
    5 янв 2016 в 19:54
  • inline не нужен нужно чтобы все шло в столбик
    – MaximPro
    5 янв 2016 в 20:03
  • Оберни в div ы, либо применяй позицирование, иначе без скриптов ничего не получиться....
    – pepel_xD
    5 янв 2016 в 20:09

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.