Форум программистов, компьютерный форум, киберфорум
Наши страницы

HTML, CSS

Войти
Регистрация
Восстановить пароль
 
macr
0 / 0 / 0
Регистрация: 27.11.2017
Сообщений: 78
#1

Расстановка блоков - HTML, CSS

08.01.2018, 17:46. Просмотров 136. Ответов 1
Метки css, html, img (Все метки)

Есть макет, по которому пишу код, и не получается последний блок, у меня есть такой код, но как выстроить картинку соответственно макету?
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<section id="about">
        <div class="container">
            <div class="title">
                <h2>
                    About Us
                </h2>
                <p>
                    Lorem ipsum dolor sit amet, consectetur.
                </p>
            </div>
            <div class="about clearfix">
                <div class="about_item"><img src="img/about1.jpg" alt="">
                    <h3 class="left">July 2010 <span>Our humble beginnings</span></h3>
                    <p class="left">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente molestiae dolore sit sunt aspernatur quae.</p>
                    
                </div>
            
            </div>
        </div>
    </section>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
.about{
    margin-top: 86px;
}
 
.about_item{
    width: 300px;
    direction: rtl;
}
 
.about_item h3{
    float: right;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}
 
.about_item span{
    margin-top: 10px;
    display: block;
    font-size: 18px;
    font-weight: bold;
    text-transform: capitalize;
}
 
.left{
    margin-top: 25px;
    float: left;
    text-align: right;
}
0
Миниатюры
Расстановка блоков  
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
08.01.2018, 17:46
Здравствуйте! Я подобрал для вас темы с ответами на вопрос Расстановка блоков (HTML, CSS):

Расстановка блоков - HTML, CSS
Привет, я в стадии изучения css, не поможете? Вот шапка: Вот html который я накатал: &lt;!doctype html&gt; ...

Расстановка блоков див - HTML, CSS
Здравствуйте. Нужна ваша помощь. Нужно расставить 4 diva по углам родительского и чтоб они обтекались текстом. &lt;!DOCTYPE HTML&gt; ...

Сбивается расстановка блоков при добавлении к тексту тег </h2> - HTML, CSS
Учусь верстать. Научился верстать лёгкую блочную структуру, но тут проблема - при вставке текста, из за того, что &lt;/h2&gt; делает пробел, у...

Параллельная вертикальная прокрутка двух блоков и отдельная горизонтальная прокрутка одного из двух блоков - HTML, CSS
Всем привет! Помогите решить проблему, пожалуйста. Есть блок div, внутри которого два блока div (в каждом из них по одной таблице),...

Расстановка переносов на страницах сайта - HTML, CSS
В какой-то статье проскользывала мысль о расстановке переносов на страницах сайта. Кто-нибудь пробовал? Или хотя бы знает, куда...

Горионтальное адаптивное меню в 2 строки - правильная расстановка переносов - HTML, CSS
Всем привет! Уже долго ломаю голову, нужно сделать чтобы это меню было в 2 строки, а не в 3... Как? Честно говоря хз, дело в том что...

1
Grey
Тутошний я
1570 / 761 / 54
Регистрация: 03.11.2009
Сообщений: 2,106
Записей в блоге: 1
13.01.2018, 01:43 #2
а если так блоки расположить?
0
Миниатюры
Расстановка блоков  
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
13.01.2018, 01:43
Привет! Вот еще темы с ответами:

Таблица из блоков - HTML, CSS
Здравствуйте! Пытаюсь сделать &quot;карусель&quot; из блоков но не могу выровнять блоки так как мне нужно. Крайний правый блок переноситься на...

Выравнивание блоков - HTML, CSS
В чем разница, при выравнивании блоков через display: inline-block; или через float: left; при использовании float...

Выравнивание блоков - HTML, CSS
Привет! Не могу выровнять блок с картинкой и блок с текстом при уменьшении окна браузера. Зелёный - картинка. Серый - текст. ...

Позиционирование блоков - HTML, CSS
у меня есть 3 блока у каждого есть небольшая картинка и под картиной текст. как можно их выровнять рядом друг с другом?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru