I just added a header image to my forum and thought all was good but not so… Here’s what the site looks like without the image: [screenshot_no_header] Here’s what the site looks like with the image: [screenshot_with_header] As you can see, the avatars are huge. This is likely due to my undoubtedly crappy html. Here’s the code I used in the “After Header” section (desktop and mobile devices): img { width: 100%; height: auto; } I have put a band-aid on it for now by hiding the users (.topic-list .posters {display: none;} but for some reason it only works with the Desktop css, not the Mobile css. Any pointers as to where I went wrong?

[image] ron_jeremy: where I went wrong? The style img {width: 100%;} is being applied to images that you don’t want it applied to. Give the header image a class and then just apply the width 100% to that. .stbc-header-image { width: 100%; height: auto; }

After Header image causing huge user avatars on mobile devices

Product Support

ron_jeremy September 14, 2017, 9:48pm 3

You, sir, are a gentleman and a scholar. I thank you very much.

Topic		Replies	Views
Image not filling header container Product Support	18	2432	April 7, 2020
How to add customer HTML after “post_1” (part2) Product Support	4	701	September 5, 2021
Keep the image within the post area Product Support	2	518	June 2, 2020
How to increase Header avatar size? Development	15	3814	January 9, 2019
Mobile header is taller than the content Bug	1	1089	January 19, 2015

After Header image causing huge user avatars on mobile devices

Related topics