Расположить блоки по ширине родителя

zodcyi · August 18, 2013

Добрый день! Есть следующий код html и css:


<!DOCTYPE html>
<html>
<head>
<title>test-page</title>
<meta charset="utf-8" />
<style>
body {margin: 0px;}
header {width: 1000px; margin: 0px auto}
#a {width: 300px; float: left; background: #27408B}
#b {width: 200px; float: right; background: #008B00}
#c {background: #CD2626; height: 150px}
#a, #b {height: 100px;}
</style>
</head>
<body>
<header>
<div id="a"></div>
<div id="b"></div>
<div id="c"></div>
</header>
</body>
</html>

Задача. Левый синий блок (div id="a") и правый зеленый (div id="b") имеют непостоянную ширину, то есть их ширина изменяется в зависимости от контента. Необходимо сделать так, чтобы центральный блок красного цвета (div id="c") занимал всю оставшуюся ширину между этими двумя блоками - синего и зеленого цвета. Использование свойства float необязательно. Вот ссылка на страницу https://dl.dropboxus.../test-page.html

Спасибо!

antonKar · August 19, 2013

b и c меняете местами, для a делаете float: left, для b float:right, для c overflow: hidden

Sign In

Расположить блоки по ширине родителя

Question

zodcyi

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

antonKar

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information