Text inside colors overlap background :: CSS

HTML-CSS
#1

How to align text inside background image as below -

table2ss

<tr>
        <td align="center" valign="top"  class="templateColumnContainer" >
            <table border="0" cellpadding="20" cellspacing="0" width="100%">
                <tr>
                    <td class="rightColumnContent" style="; "max-width: 280px;"><h7 class="text-block">Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet,consectetur adipiscing elit.consectetur adipiscing elit </h7>
                    </td>
                </tr>
                
            </table>
        </td>
    </tr>
#2

Why do you need a table?

#3

Its actually email template and requirement is to use a table.

#4

You have a number of errors in your HTML, you can run it through a validator like this to check: https://validator.w3.org/

Here are some example templates that might help: Email Template using HTML and CSS - GeeksforGeeks

#5

Thank you first of all for giving validator so that I can check. I am new to this and email I have a design which I have to build a markup and style it.I finally arrived with a solution but it was not responsive.I can check the validations and correct them but I am stuck in between building it completely.
Also can you please tell me what exactly is the mistake here.I have only added 2nd row of the table as the first row was fine.

Which website do you suggest for more understanding of responsive websites or emails.

#6

Ok I should’ve mentioned that not all of the errors shown are relevant for you, since you’re not building a website but only an email template. I have absolutely no experience with those, but the errors that need fixing are

  • wrap the whole code in a <table></table>, <tr> or <td> elements need to be children of tables
  • this is wrong syntax: <td class="rightColumnContent" style="; "max-width: 280px;">, the first semicolon in the style attribute followed by a double quote causes errors
  • a <h7> doesn’t exist in HTML, maybe you meant a <h6>

As mentioned, I can only google email templates (responsive or not), but generally, it depends on how much time you have. If you only need this one template to be responsive, I’m sure you can find a template if you google specifically for responsiveness, but if you really want to learn how to write responsive CSS, the fCC curriculum linked in the upper left corner has a lot of lessons.