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

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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