Не получается вставить картинку в виджете html блок 2.X

 
Посетитель
small user social cms
Медаль
Сообщений: 180
В виджет html блок пишу этот код:

div.container {
width: 96%;
max-width: 960px;
margin: 0 auto; /* центрируем основной контейнер */
}
img {
width: 100%; /* ширина картинки */
height: auto; /* высота картинки */
}
<div class="container">
<img src="http://delatdelo.com/wp-content/uploads/2018/07/4.3-2.jpg" width="960" height="640" />
</div>

А так выводит на сайте.
Прикрепленные файлы:
E4E7EF22FCB94B41B6EB3ACC3A09F4C7_17ua8.jpeg | 682.7 Кб | Скачали: 71
Посетитель
small user social cms
Медаль
Сообщений: 438
@Milyana:
А так выводит на сайте.
Браузер просто "выводит" картинку с "довесками", т. к. не описан сам контейнер как таковой.
При использовании bootstrap-а будет иной случай.
Редактировалось: 1 раз (Последний: 17 ноября 2018 в 08:23)
Реклама
cms
Посетитель
small user social cms
Медаль
Сообщений: 180
DeDja:

@Milyana:
А так выводит на сайте.
Браузер просто "выводит" картинку с "довесками", т. к. не описан сам контейнер как таковой.
При использовании bootstrap-а будет иной случай.

А как это сделать? Нужно просто вставить картинку над списком записей и чтоб картинка была адаптивной.
Посетитель
small user social cms
МедальАвторитет форумаКубок зрительских симпатий
Сообщений: 3510
@Milyana, вы забыли обернуть в <style> ваши стили
Код HTML:
  1. <style>div.container {
  2. width: 96%;
  3. max-width: 960px;
  4. margin: 0 auto; /* центрируем основной контейнер */
  5. }
  6. img {
  7. width: 100%; /* ширина картинки */
  8. height: auto; /* высота картинки */
  9. }</style>
  10. <div class="container">
  11. <img src="http://delatdelo.com/wp-content/uploads/2018/07/4.3-2.jpg" width="960" height="640" />
  12. </div>
Посетитель
small user social cms
Медаль
Сообщений: 438
@Milyana:
А как это сделать?
Для конкретного размера контейнера можно описать его
в theme-layout.css по примеру описания
#layout header{
height: 50px;
....................
.................... }
с использованием медиа запросов.
Успехов.
Редактировалось: 1 раз (Последний: 17 ноября 2018 в 08:56)
Посетитель
small user social cms
Медаль
Сообщений: 180
Loadырь:

@Milyana, вы забыли обернуть в ваши стили
Код HTML:
  1. div.container {
  2. width: 96%;
  3. max-width: 960px;
  4. margin: 0 auto; /* центрируем основной контейнер */
  5. }
  6. img {
  7. width: 100%; /* ширина картинки */
  8. height: auto; /* высота картинки */
  9. }
  10.  
  11.  
  12.  




Спасибо большое, как всегда выручаете:)
В начало страницы
Предыдущая темаСледующая тема Перейти на форум: