Archived topic
text under image
5 replies · Started by Brian on April 21, 2020
Hi,
Is it possible to have text under an image to be the same width as the image? the image is 768px wide. I have tried max- width but I can't get it to centre for me, even though I use the text-align attribute. I would appreciate the help.
Kind Regards,
Brian Thompson
Hi there,
you have an opening DIV: <div align="center">
Change that to: <div class="custom-container">
Then add this CSS:
.custom-container {
max-width: 768px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.custom-container img {
width: 100%;
}
The second part of the CSS is to make your images respond to screen size changes.
Hi David,
Thank you very much! I didn't know what to do. One question though, what is meant by the auto attribute?
See explanation here:
https://www.w3schools.com/css/css_margin.asp
In this case it just centers the element.
Thank you Leo, I have seen it in use on other sites but I didn't really know what it meant.
Kind Regards,
Brian Thompson
No problem :)