Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Карта форума Темы раздела Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.97/34: Рейтинг темы: голосов - 34, средняя оценка - 4.97
0 / 0 / 0
Регистрация: 16.12.2016
Сообщений: 40
1

Смещается текст

29.01.2017, 18:09. Показов 7123. Ответов 13
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
Текст залез на статью, как это можно исправить?
HTML5
1
2
3
4
5
6
7
8
9
<ol type="I" >
        <li>cashback1</li>
        <li>cashback2</li>
        <li>учи английский смотря видео!</li>
        <li>5 шагов к Photoshop</li>
        <li>Дешевые авиабилеты онлайн</li>
        <li>Система интернет-бронирования отелей</li>
        <li>Раздел 1</li>
    </ol>
CSS
1
2
3
ol {
    float: left; margin-left: 200px; margin-top: 60px; font-size: 1.5em;
}
Миниатюры
Смещается текст  
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
29.01.2017, 18:09
Ответы с готовыми решениями:

Блок смещается на текст
Здравствуйте! Специалисты подскажите пожалуйста. На сайт добавил простой слайдер фото без скриптов,...

Текст ссылки смещается из блока ul на уровень ниже
Пожалуйста помогите....создал вертикальное меню и текст первого &quot;блока&quot; сместился вниз на другой...

Почему при клике мышки текст смещается вниз
Не могу понять, и как сделать чтоб текст не смещался вниз когда мышкой кликаешь по тексту......

Смещается footer
Всем привет. Ситуация такая, футер съезжает непонятно куда и встаёт между другими блоками. Грешу...

13
84 / 81 / 42
Регистрация: 20.01.2017
Сообщений: 219
29.01.2017, 21:18 2
уменьши для ol margin-left, уменьши font-size, задай списку ширину небольшую
0
0 / 0 / 0
Регистрация: 16.12.2016
Сообщений: 40
29.01.2017, 21:51  [ТС] 3
Это я понимаю, но мне бы хотелось ,чтобы он совсем не заходил в article , ограничить его своим местом, что для этого нужно новый раздел создать? может быть весь сайт заключать в таблицу?
0
143 / 133 / 69
Регистрация: 08.11.2013
Сообщений: 767
Записей в блоге: 5
29.01.2017, 21:56 4
Скиньте полностью код
0
84 / 81 / 42
Регистрация: 20.01.2017
Сообщений: 219
29.01.2017, 22:02 5
только по коду одного списка не понятно, что и как на сайте расположено
0
0 / 0 / 0
Регистрация: 16.12.2016
Сообщений: 40
29.01.2017, 22:13  [ТС] 6
Css код нужно?
HTML5
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
<body>
    <header>
        <h1>Полезные ссылки,которые помогут сэкономить</h1>
        <h2>Здесь я сделал подборку полезных сайтов для каждого обывателя интернета</h2>
 
        <div class="subscribe">
            <form action="" method="post" >
                 <input type="text" name="name" placeholder="enter your name">
                 <input type="email" name="email" placeholder="enter your email">
                 <input type="submit" value="Add me Now" >
            </form>
        </div>
    
        <p>* Рассылка пока еще не функционирует,просим извинения за неудобства</p>
 
        
        
    </header>
<section>
     
    
    
    <ol type="1" >
        <li><a href="#metka1" target="_self" title="Перейти к разделу" >cashback1</a></li>
        <li><a href="#metka2" target="_self" title="Перейти к разделу" >cashback2</a></li>
        <li><a href="#metka3" target="_self" title="Перейти к разделу" >Учи английский смотря видео!</a></li>
        <li><a href="#metka4" target="_self" title="Перейти к разделу" >5 шагов к Photoshop</a></li>
        <li><a href="#metka5" target="_self" title="Перейти к разделу" >Дешевые авиабилеты онлайн</a></li>
        <li><a href="#metka6" target="_self" title="Перейти к разделу" >Система интернет-бронирования отелей</a></li>
        <li><a href="#metka7" target="_self" title="Перейти к разделу" >Раздел 7</a></li>
    </ol>
    
 
    <article class="cashback">
                  
         
         <a href="https://letyshops.ru/soc/vk-1?r=1421615" class="global"><img class="imgleft" src="https://www.cyberforum.ru/images/PcH4PjfUbCI.jpg" alt="" /></a>
         
         <a name="metka1"></a>
         
         <h1><a href="https://letyshops.ru/soc/vk-1?r=1421615">Lety shops</a></h1>
          
         <p class="description">Сервис letyshops является лучшим проектом для покупок в интернете в более чем 800 магазинах(ЮЛМАРТ, Aliexpress, СпортМастер, М.Видео, Asos, La Redoute, Лабиринт и многие другие) собранных в одном месте и в связи с этим отпадает необходимость регистрации на многих ресурсах. На нём представлены только лучшие магазины для совершения покупок. Войдя в свой аккаунт Вы выбираете нужный Вам магазин и выбрав товар совершаете заказ. После оформления заказа Вам мгновенно начисляется кэшбэк и он попадает в категорию В ожидании. После того, как заказ оплачен и подтверждён Ваш кэшбэк переводится на баланс.</p>
 
         <p>Выгоды:<p>
          
         <ul class="description">
 
           
            <li>Возможность получить <b>кэшбэк до 30%</b>;</li>
            <li>Проводимые на постоянной основе акции дают возможность увеличивать кэшбэк в два раза и получать уникальные промокоды для покупок, а также участвовать в розыгрыше призов;</li>
            <li>Возможность онлайн-подсчета годовой экономии при покупках используя кэшбэк-сервис;</li>
            <li>Если клиент выкупает только часть товара, то он имеет возможность возврата не израсходованных средств;</li>
            <li>Возможность получить премиум аккаунт, позволяющий получать повышенный кэшбэк с каждой <i>покупки</i>;</li>
            <li>У каждого пользователя, есть уникальная возможность использовать кэшбэк-сервис - Lety-коды. Если назвать своими словами, то это промокоды дающие возможность увеличить кэшбэк. тем самым больше возвратить от затраченной суммы на покупку себе на счёт;</li>
            <li>Вывод на: банковские карты, мобильный телефон, Webmoney, Yandex.Деньги, Qiwi, Paypal.</li>
         </ul>
 
             <p>При регистрации указывайте правдивые данные, что бы у Вас не возникло проблем в будущем с выводом.</p>
             
              
          
         <a name="metka2"></a>
          
         <h2><a href="http://epngo.bz/cashback_index/te74jb">epn.bz</a></h2>
         
         <a href="http://epngo.bz/cashback_index/te74jb"><img class="imgleft" src="https://www.cyberforum.ru/images/Безымянны222й.png" alt="" /></a>
         
         <p>
             
             <p>Выгоды:<p>
             
             <ul class="description">
             
 
                 <li> Только у нас от 7% до 18% кэшбэка в магазине AliExpress и самые высокие ставки на рынке в магазинах-партнерах!</li>
                 <li> Получайте деньги сразу</li>
                 <li> Заказывайте выплату сразу после подтверждения получения товара и получайте деньги на свой счет в течение 5 ти минут!</li>
                 <li> Удобный вывод</li>
                 <li> Выводите без комиссии</li>
                 <li> любым удобным для Вас способом.</li>
                 <li> Минимальная сумма вывода всего 0,2$!</li>
                 <li> Доступен вывод в долларах!</li>
                 <li> Покупайте товары в любимых магазинах и получайте кэшбэк!</li>            
                 <li> Cashback (кэшбэк) дословно переводится как "возврат денег".</li>
                 <li> Кэшбэк на интернет-<i>покупки</i> позволяет получать назад часть денег, которые Вы обычно тратите в Интернете.</li>
             </ul>
            
            
            
            
        </p>
        
        
         <a name="metka3"></a>  
        
         <h3><a href="https://puzzle-english.com/p/2889404"> puzzle-english</a></h3>
         
         <a href="https://puzzle-english.com/p/2889404"><img class="imgleft" src="https://www.cyberforum.ru/images/banner_5_red (1)_Fotor.jpg" alt="" /></a>
         
         <p> О компании</p>
 
         <p>
             
             
             <ul class="description">
 
                 
                 <li> Puzzle English – популярный онлайн-ресурс для тренировки всех навыков английского языка: понимания на слух, чтения, письма, устной речи. На сайте зарегистрировано 3 млн пользователей. Ежедневно сервисы ресурса посещают 100 тыс. человек, а 50 тыс. пользуются мобильными приложениями.</li>
                 <br></br>
                 <li> Сайт Puzzle English появился в 2011 году как авторский проект Александра Антонова. Активное развитие началось в августе 2014 года, когда компания привлекла первых инвесторов. Команда из пяти человек начала работу в московском офисе. Был полностью обновлен дизайн сайта, запущен инновационный сервис сериалов с двойными субтитрами.</li>
                 <br></br>
                 <li> За 2015 год число пользователей проекта выросло с 50 тыс. до 1,5 млн, появились четыре мобильных приложения на платформах iOS и Android. В конце года свет увидели уникальные курсы «Метод Тичера». В 2016 году на сайте появились новые увлекательные игры, разнообразные тренировки и не имеющий аналогов видеокурс с носителем английского языка Puzzle Academy.</li>
                 <br></br>
                 <li> Компания имеет собственную видеостудию, производящую авторский контент. Штат сотрудников увеличился до 40 человек, работающих как в офисе, так и удалённо. Сегодня Puzzle English – один из самых динамично развивающихся образовательных онлайн-сервисов в России и странах СНГ.</li>
                
 
             </ul>
            
            
            
            
         </p>
         
         
         <a name="metka4"></a>
         
         <h4><a href="https://photoshop-master.ru">photoshop-master</a></h4>
         
         <a href="https://photoshop-master.ru"><img class="imgleft" src="https://www.cyberforum.ru/images/Безымянны2й.jpg" alt="" /></a>
         
         <p>5 шагов к PHOTOSHOP</p>
 
         <p>
             
             
             <ul class="description">
 
                 
                 <li>Проект photoshop-master.ru был создан 12 июня 2007 года.</li>
                 <br></br>
                 <li>На сегодняшний день «Фотошоп-мастер» — это крупный обучающий портал по программе Adobe Photoshop. Мы входим в тройку лучших сайтов по фотошопу в рунете. У нас собрано более 2 700 фотошоп-уроков, более 20 000 фотошоп-дополнений и более 150 статей. Посещаемость сайта более 40 000 человек в день, в нашем сообществе в ВКонтакте более 60 000 человек, а на рассылку проекта подписано более 105 000 человек.</li>
                 <br></br>
                 <li>На сайте работает дружная команда фотошоп-мастеров. Авторы, переводчики, администраторы ежедневно стараются удивить вас свежими уроками и дополнениями. А модераторы на форуме, всегда помогут и подскажут новичкам, дадут ценный совет или инструкцию.</li>
                 <br></br>
                 <li>Мы регулярно проводим конкурсы по фотошоп-мастерству. Конкурсы — это отличный стимул к совершенствованию своих навыков. Пользователи сайта находят это мероприятие очень увлекательным!</li>
                 <br></br>
                 <li>Для тех, кто хочет быстро овладеть программой Adobe Photoshop на самом высоком уровне, мы создаем полноценные обучающие курсы по разным направлениям: общее знание программы, коллажи, обработка фотографий, создание фотокниг, создание презентаций. Все эти курсы сделаны с душой, и стоят совсем недорого. Доходы от продаж курсов помогают нам развивать проект.</li>
                 <br></br>
                 <li>Наш сайт широко представлен в социальных сетях. Вы можете легко найти нас ВКонтакте, в Одноклассниках, на Facebook, а также на канале Youtube, где публикуются все эксклюзивные видеоуроки, которые создаются авторами специально для нашего сайта.</li>
                 <br></br>
                 <li>Мы уверены, что вам будет интересно общаться с нами. Здесь вы найдете много качественной полезной информации: уроки, статьи, дополнения, а самое главное, единомышленников, которые, как и вы, только начинают разбираться в премудростях программы Фотошоп.</li>
                 
 
             </ul>
            
            
            
            
         </p>
         
         
         
         <a name="metka5"></a>
         
         <h4><a href="http://www.aviasales.ru/?marker=123873">дешевые авиабилеты онлайн</a></h4>
         
         <a href="http://www.aviasales.ru/?marker=123873"><img class="imgleft" src="https://www.cyberforum.ru/images/Безымя222нный.jpg" alt="" /></a>
         
         <p>Лучший способ купить авиабилеты дешево</p>
 
         <p>
             
             
             <ul class="description">
 
                 
                 <li>Aviasales.ru был запущен в январе 2008 года как удобная основателю RSS-лента. Однако, сайт оказался интересен многим путешественникам, потому и вырос в самостоятельный проект. Вначале данные о спецпредложениях получались из открытых источников, с других сайтов и из рассылок авиакомпаний.</li>
                 <br></br>
                 <li>Сегодня Aviasales.ru — первый и крупнейший в Рунете метапоиск дешевых авиабилетов. Мы ищем авиабилеты в 728 авиакомпаниях, 200 авиакассах и 5 системах бронирования (GDS), используя наиболее современные технологии. Вы выбираете, где покупать. Наш инновационный нанопоиск авиабилетов найдет для вас не только самый лучший вариант на конкретные даты, но и предложит другие даты, когда стоимость перелета может быть ещё ниже. Выбирайте самые «дешёвые даты» в специальном разделе сайта Календарь низких цен.</li>
                 <br></br>
                 <li>На сайте собрана самая большая база предложений авиакомпаний, летающих по России, СНГ и странам мира. Редакция имеет прямые контакты со многими авиакомпаниями и получает информацию об акциях порой раньше, чем она публикуется на сайте самой авиакомпании. Удобная подписка на новости по RSS, e-mail, в Twitter, Instagram, Одноклассниках, Google+, Pinterest и в LiveJournal позволяет читателям получать свежую информацию наиболее удобным для них образом. Наши группы в социальных сетях ВКонтакте и Facebook насчитывают более 100 000 участников.</li>
                
             </ul>
            
            
            
            
         </p>
         
         
         <a name="metka6"></a>
         
         
         <h4><a href="https://secure.booking.com/mywishlist.html?aid=912188;tflv=0;wl=3LRXOsZStSm0U74qZ3EWyno3Sfg&">Booking.com</a></h4>
         
         <a href="https://secure.booking.com/mywishlist.html?aid=912188;tflv=0;wl=3LRXOsZStSm0U74qZ3EWyno3Sfg&"><img class="imgleft" src="https://www.cyberforum.ru/images/Безымя2222нный.jpg" alt="" /></a>
         
         <p>система интернет-бронирования отелей</p>
 
         <p>
             
             
             <ul class="description">
 
                 
                 <li>основана в Амстердаме в 1996 году, приобретена в 2005 году за $133 млн компанией The Priceline Group (NASDAQ: PCLN), фокусирующейся на европейский рынок[1]. Штаб-квартира компании находится в Амстердаме, (Нидерланды).</li>
                 <br></br>
                 <li>голландская компания, являющаяся мировым лидером на рынке бронирования отелей. В базе сервиса более 390.000 отелей, хостелов, апартаментов в более чем 190 странах. Главный офис компании находится в Амстердаме, имеются представительства более чем в 50 странах, включая российские офисы в Москве, Санкт-Петербурге и Сочи. Сайт Букинг.ком отличается одним из самых удобных интерфейсов и самой большой базой отзывов об отелях.</li>
                 <br></br>
                 <li>Лауреат премии 2012 Independent Travel Website Ratings от компании J.D. Power</li>
                 <br></br>
                 <li>Служба поддержки клиентов Booking.com работает на 41 языке включая русский. С недавнего времени для клиентов из России доступен бесплатный номер телефона в коде 8-800</li>
                
             </ul>
            
            
            
            
         </p>
         
         
         <a name="metka7"></a>
         
         <h4><a href="https://secure.booking.com/mywishlist.html?aid=912188;tflv=0;wl=3LRXOsZStSm0U74qZ3EWyno3Sfg&">Booking.com</a></h4>
         
         <a href="https://secure.booking.com/mywishlist.html?aid=912188;tflv=0;wl=3LRXOsZStSm0U74qZ3EWyno3Sfg&"><img class="imgleft" src="https://www.cyberforum.ru/images/Безымя2222нный.jpg" alt="" /></a>
         
         <p>система интернет-бронирования отелей</p>
 
         <p>
             
             
             <ul class="description">
 
                 
                 <li>основана в Амстердаме в 1996 году, приобретена в 2005 году за $133 млн компанией The Priceline Group (NASDAQ: PCLN), фокусирующейся на европейский рынок[1]. Штаб-квартира компании находится в Амстердаме, (Нидерланды).</li>
                 <br></br>
                 <li>голландская компания, являющаяся мировым лидером на рынке бронирования отелей. В базе сервиса более 390.000 отелей, хостелов, апартаментов в более чем 190 странах. Главный офис компании находится в Амстердаме, имеются представительства более чем в 50 странах, включая российские офисы в Москве, Санкт-Петербурге и Сочи. Сайт Букинг.ком отличается одним из самых удобных интерфейсов и самой большой базой отзывов об отелях.</li>
                 <br></br>
                 <li>Лауреат премии 2012 Independent Travel Website Ratings от компании J.D. Power</li>
                 <br></br>
                 <li>Служба поддержки клиентов Booking.com работает на 41 языке включая русский. С недавнего времени для клиентов из России доступен бесплатный номер телефона в коде 8-800</li>
                
             </ul>
            
            
            
            
         </p>
         
         <a href="mailto:Skilful93@mail.ru" target="_blank" >Написать нам</a>
       
    </article>
    
    <div class="subscribe">
        <form action="" method="post" >
            <input type="text" name="name" placeholder="enter your name">
            <input type="email" name="email" placeholder="enter your email">
            <input type="submit" value="Add me Now"
        </form>
    
</section>  
</body>
0
143 / 133 / 69
Регистрация: 08.11.2013
Сообщений: 767
Записей в блоге: 5
29.01.2017, 22:17 7
Да, нужен
0
0 / 0 / 0
Регистрация: 16.12.2016
Сообщений: 40
29.01.2017, 22:19  [ТС] 8
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
body {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
    background: #eeeeee;
}
 
.cashback {
  max-width:1000px;
  margin: 0 auto;
  padding: 50px 20px;
}
 
.cashback h1 {
    text-align: center;
    font-size: 2em;
}
 
.description {
    text-align: justify;    
}
 
.imgleft {
  float:left;
  margin: 0px 30px 20px 0;
}
 
.banner {
    margin: auto;
    display: block;
}
 
a {
  text-decoration: none;
  
}
 
ol {
    float: left; margin-left: 150px; margin-top: 60px; font-size: 1.5em; 
}
 
li{
    text-align: left;
}
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
30
31
32
33
34
35
36
article{
    max-width:1000px; margin:0 auto; padding: 50px 20px; background: #fff;
}
 
    article>h1{
         font-size: 3em; text-align: center; margin-bottom: 25px;
    }
 
    article>h2{
         font-size: 2em; text-align: center; margin-bottom: 0px;
    
    }
    
    article>h3{
         font-size:2em;  margin-top: 20px; text-align: center;margin-bottom: 20px;
    
    }
    
    article>h4{
         font-size: 2em; text-align: center; margin-bottom: 20px; margin-top: 70px;
    
    }
 
 
    article>p{
         line-height:1.5em;margin-bottom: 20px;
        
    }
    
          
    
    
                        
    .imgleft{
        float:left; margin: 0px 30px 20px 0;
    }
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
30
31
32
33
header{
    background: url(images/header-bg.jpg) center center no-repeat; color: #fff; text-align: right; padding: 125px 20px 90px 20px; background-size:cover;
}
 
    header>h1{
         font-size: 3.75em; font-family: 'Roboto', sans-serif; margin-bottom: 25px;
    }
 
    header>h2{
         font-size: 1.75em; font-family: 'Arima Madurai', cursive;, sans-serif; margin-bottom: 15px;
    }
    
    header>div{
        text-align:center;
    }
    
    header>p{
        text-align:center; font-size:0.75em;
    }
    
    .subscribe{
        background:rgba(0,0,0,0.65);display:table; padding:20px;margin:0 auto 10px auto;border-radius:5px;
    }
    
    .subscribe  input{
        float:left;
    }   
         .subscribe  input[type="text"], .subscribe input[type="email"] {
             padding: 0; border: 0; width: 320px; margin-right: 10px; font-family: 'Arima Madurai', cursive; font-size: 1em; padding:10px 20px 10px 20px; box-sizing:border-box;
         }           
         .subscribe input[type="submit"] {
             background:#ae2c52;border:0;color:#fff;font-size:1.25em;font-weight:700;padding:10px 35px;cursor:pointer;
         }
0
84 / 81 / 42
Регистрация: 20.01.2017
Сообщений: 219
29.01.2017, 22:36 9
как вариант задай для article float:left; (но тогда при уменьшении ширины окна article будет уходить вниз списка)
0
143 / 133 / 69
Регистрация: 08.11.2013
Сообщений: 767
Записей в блоге: 5
29.01.2017, 22:37 10
Интересует, где должен располагаться текст.
0
0 / 0 / 0
Регистрация: 16.12.2016
Сообщений: 40
29.01.2017, 22:38  [ТС] 11
статью уводит( ,этого крайне бы не хотелось...
0
0 / 0 / 0
Регистрация: 16.12.2016
Сообщений: 40
29.01.2017, 22:41  [ТС] 12
Вот в этой области
Миниатюры
Смещается текст  
0
143 / 133 / 69
Регистрация: 08.11.2013
Сообщений: 767
Записей в блоге: 5
29.01.2017, 22:55 13
Подходит?
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
body {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
    background: #eeeeee;
}
 
.cashback {
  max-width:60%;
  margin: 0 auto;
  padding: 50px 20px;
  background: #fff;
  display: inline-block;
}
 
.cashback h1 {
    text-align: center;
    font-size: 2em;
}
 
.description {
    text-align: justify;
}
 
.imgleft {
  float:left;
  margin: 0px 30px 20px 0;
}
 
.banner {
    margin: auto;
    display: block;
}
 
a {
  text-decoration: none;
 
}
 
ol {
    float: left;
    margin-top: 60px;
    font-size: 1.5em;
    width: 20%;
    display: inline-block;
}
 
li{
    text-align: left;
}
 
    article>h1{
         font-size: 3em; text-align: center; margin-bottom: 25px;
    }
 
    article>h2{
         font-size: 2em; text-align: center; margin-bottom: 0px;
 
    }
 
    article>h3{
         font-size:2em;  margin-top: 20px; text-align: center;margin-bottom: 20px;
 
    }
 
    article>h4{
         font-size: 2em; text-align: center; margin-bottom: 20px; margin-top: 70px;
 
    }
 
 
    article>p{
         line-height:1.5em;margin-bottom: 20px;
 
    }
 
 
 
 
 
    .imgleft{
        float:left; margin: 0px 30px 20px 0;
    }
 
    header{
    background: url(images/header-bg.jpg) center center no-repeat; color: #fff; text-align: right; padding: 125px 20px 90px 20px; background-size:cover;
}
 
    header>h1{
         font-size: 3.75em; font-family: 'Roboto', sans-serif; margin-bottom: 25px;
    }
 
    header>h2{
         font-size: 1.75em; font-family: 'Arima Madurai', cursive;, sans-serif; margin-bottom: 15px;
    }
 
    header>div{
        text-align:center;
    }
 
    header>p{
        text-align:center; font-size:0.75em;
    }
 
    .subscribe{
        background:rgba(0,0,0,0.65);display:table; padding:20px;margin:0 auto 10px auto;border-radius:5px;
    }
 
    .subscribe  input{
        float:left;
    }
         .subscribe  input[type="text"], .subscribe input[type="email"] {
             padding: 0; border: 0; width: 320px; margin-right: 10px; font-family: 'Arima Madurai', cursive; font-size: 1em; padding:10px 20px 10px 20px; box-sizing:border-box;
         }
         .subscribe input[type="submit"] {
             background:#ae2c52;border:0;color:#fff;font-size:1.25em;font-weight:700;padding:10px 35px;cursor:pointer;
         }
1
0 / 0 / 0
Регистрация: 16.12.2016
Сообщений: 40
29.01.2017, 23:08  [ТС] 14
Спасибо) да это самое оно)
0
29.01.2017, 23:08
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
29.01.2017, 23:08
Помогаю со студенческими работами здесь

Смещается background
Всем привет. Не могу понять в чем дело. Вставляю блок с картинкой, пишу в css {width:100%;} Блок...

Не смещается блок
&lt;!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.01//EN&quot; &quot;http://www.w3.org/TR/html4/strict.dtd&quot;&gt; &lt;html&gt;...

Смещается таблица
Здравствуйте! Решил попрактиковаться в создании сайтов и нашел в интернете шаблон &quot;MeMostra&quot;....

Смещается блок
Доброго времени суток. Проблема такая. После добавление блока telefon, у меня стал смещаться блок...

Смещается надпись
Помогите, как только прописую надписи к картинкам, перестает действовать правило display: inline; ...

Футер сайта смещается
.footer { width: 800px; height: 100px; text-align:center; font-size: 14pt; ...


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

Или воспользуйтесь поиском по форуму:
14
Ответ Создать тему
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru