Настройка процента ширины внутреннего Div от родительского

#html

#HTML

Вопрос:

У меня есть 2 родительских div. (родительский левый и родительский правый). Родительский левый составляет 50 пикселей, а родительский правый занимает оставшуюся ширину экрана, поэтому я установил его на 100%.

У меня есть 2 дочерних / внутренних подразделения в родительском праве. Мне нужно, чтобы он занимал 85% и 15% от ширины родительского права, но он вычисляет процент в зависимости от ширины экрана. Что я делаю не так?

Код ниже:

 <div class="row clearfix">

<div id='parent-left' style="width:50px;float:left;background-color:blue;"><span> parent-left </span>
</div>

<div id='parent-right' style="width:100%;">
  <div id='inner-left' style="width:85%;float:left;background-color:green;"><span> inner1</span></div>
  <div id='parent-right' style="width:15%;float:left;background-color:gray"><span> inner2</span></div>
</div>


</div>

Ответ №1:

Не устанавливайте a width для #parent-right элемента, вместо этого установите a left-margin равным width значению #parent-left элемента.

 <div id='parent-right' style="margin-left:50px;">

Демонстрация на http://jsfiddle.net/gaby/5J38g /

1. потрясающе, ваше решение работает! не могли бы вы сказать мне, почему 100% на родительском праве может вызвать проблемы с дочерним элементом? Просто для получения технического понимания….

2. установка 100% вправо не приводит к тому, что он занимает оставшуюся часть экрана, он занимает весь экран. Элемент влияет только на его содержимое #parent-left . Это можно увидеть, если добавить цвет фона к правому div и нажать на левый.. См . jsfiddle.net/gaby/v4Jrh

3. @user3658423 Обычно стилизовать содержимое под HTML-код — плохая практика. Вы всегда должны пытаться отделить свой CSS от своего HTML, используя либо внешние таблицы стилей, либо <style> теги. Вы также никогда не должны присваивать двум элементам один и тот же идентификатор (родительское право). Я предполагаю, что это была опечатка.