I’ve been trying to find out how to square a rectangle image and have text appear to the left of it. I want the next element to be below it and currently – I’m not there. Please help me fix this coding.
<html>
<head>
<style>
body {
margin: 20px;
text-align: left;
}
img {
float: left;
margin: 5px;
}
@media (max-width: 760px) {
.row {
margin-bottom: 15px;
}
</style>
</head>
<div class="square">
<div>
<img src=
"https://bespokeattireco.com/cdn/shop/files/IMG-1944.jpg?v=1699514408"
width="auto"
height="135px">
</div>
<p>
Adding bands to the wrists allow the sleeves to take a different shape. Please note, bands will be the same color as rest of the garment unless otherwise stated in the notes box below.
</p>
</div>
</html>
The problem’s I’m having it a cannot figure out how to square the image. I got the text to the right side, but it is also moving the next eliment to the right side of the image as well which I don’t want.
New contributor
Bernice Kay is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.