Блог

Главная - Вопросы по программированию - Отображение 1 ПРОЛЕТА A слева и 2 ПРОЛЕТА (B и C) справа друг над другом

Отображение 1 ПРОЛЕТА A слева и 2 ПРОЛЕТА (B и C) справа друг над другом

#html #css #position

#HTML #css #положение

Вопрос:

Как я могу отобразить что-то вроде этого:

введите описание изображения здесь

JSFIDDLE ЗДЕСЬ:

http://jsfiddle.net/Djtk9/1/

  div {

   border: 1px solid black;
   height: 200px;
   width: 400px;
  display: inline-block;
 }

 span {
   border: 1px red solid;
  position: relative;
  width: 100%;
  height: 100%;
}

Комментарии:

1. Убрать отображение: встроенный блок? Это приведет к тому, что ваши A, B и C будут находиться в одной строке друг с другом. И это неопределенный вопрос, что именно вы пытаетесь получить?

2. Нравится это? jsfiddle.net/Djtk9/4

Ответ №1:

Что-то вроде этого JSFiddle

 #a{
    width: 20%;
    height: 100%;
    float: left;
    background: red;
}

#b {
    width: 80%;
    height: 50%;
    float: left;
    background: yellow;
}

#c {
    background: blue;
    width: 80%;
    height: 50%;
    float: left;
}