Позиционирование таблицы в Html

Question

Подскажите пожалуйста. Сайт резиновый, сразу за заголовком ставлю картинку с такими параметрами:

<img class="image_for_lessons" src="../../img/lessons/lesson_2/lesson_2.1/image_2.1.jpg"  alt="Английский алфавит упражнения">

В css для картинки следующее свойство:

.image_for_lessons {
    text-align:left;
    margin:20px 10px 5px 0px;
    width:480px;
    height:360px;
    float:left;
}

Потом у меня идёт текст, и так я сделал для большинства своих страниц сайта. Чтобы наглядно было видно, вот так это выглядит http://englishask.ru/lessons/small_lessons/lesson_1.4.php Подскажите пожалуйста, если после текста я хочу вставить таблицу и чтобы она располагалась сразу под изображением на всю ширину серединной области article как мне это сделать? Можно ли без js обойтись ? Просто иногда текста мало и сразу идёт таблица, а она получается в ширину оставшейся области (ну то есть за минус ширины картинки) и выглядит некрасиво.

Answer 1

Как вариант...

img {
  width: 50%;
  float: left
}
table {
  clear: both;
}

<img src='https://avatars.mds.yandex.net/i?id=2ee3bcd17de5d5cb7f3e5b50428a62ae_l-5233279-images-thumbs&ref=rim&n=13&w=640&h=640' />
<table border='1'>
  <td>ФИО</td>
  <td>Дата</td>
</table>

БЛОГ НА HUSL

Позиционирование таблицы в Html

Ответы (1 шт):