How can I modify this HTML code to change image presentation?

Technical Q&A

Topic summary

A user sought help transforming HTML code to change how an image is displayed, providing before and after screenshots. The original code contained reversed text and CSS styling for text transformation and alignment.

The issue was quickly resolved using ChatGPT, which provided corrected markup. The user shared the solution for others who might encounter similar problems, though the specific corrected code wasn’t fully detailed in the follow-up.

Key elements involved:

  • Text styling (font-size, text-transform, text-align)
  • HTML structure with paragraph and span tags
  • Image presentation modification

The discussion appears resolved with the user successfully implementing the fix.

Summarized with AI on November 18. AI used: claude-sonnet-4-5-20250929.
1

Hey Everyone

I have a quick question about a html-code, I want to transform the first picture into the second picture. I have added the html code down belown.

d826522d-cc12-484d-8648-7fca7b178cfd.jpg
d826522d-cc12-484d-8648-7fca7b178cfd.jpg828×293 6.5 KB

53db560e-ef2c-42d0-97e1-4b7e7ddebcdf.jpg
53db560e-ef2c-42d0-97e1-4b7e7ddebcdf.jpg828×263 5.54 KB

Code:

<p style="text-align: center; "><span style="font-size: 12pt; text-transform: uppercase;"><strong>our standards</strong></span></p>
<hr>

Thanks in advance!

2

Hey Everyone

Here’s the solution for anyone who needs it (btw. ChatGPT fixed this issue for me):


  
  OUR STANDARDS