Загрузочный центр Изображение и правое выравнивание другого изображения

Question

Я нашел части и части этого вопроса, но я не могу понять это правильно.

Я пытаюсь центрировать изображение логотипа в верхней части страницы, а затем выравнивать второе изображение вокруг текста ниже логотипа. Я не совсем уверен, насколько ясны работы. До сих пор у меня есть это:

.div1 { 
display: block; 
margin: 0 auto; 
} 

.div2 { 
float: right; 
margin: 0 0 10px 10px; 
clear: right; 
} 

то изображения устанавливаются как:

<div class="div1"> <img src="images/angiervineyardslogo.jpg" width="200"   height="167" alt=""/></div>text goes here ... 
<div class="div2"><img src="images/pink_ribbon.png" width="155" height="253"  alt=""/></div> 

Я хочу, чтобы создать адаптивную страницу, поэтому я использую самозагрузки, но я далеко трек со всеми это ... Любая помощь будет оценена по достоинству. Благодаря

Answer 1

Применить классы для ваших изображений и поместить все стили в CSS, а не в HTML

.centered { 
 
    display: block; 
 
    width: 400px; 
 
    height: 400px; 
 
    margin: 0 auto; 
 
}

<img class='centered' src='https://static.pexels.com/photos/105066/pexels-photo-105066-large.jpeg'>