DEV Community

Your Average Roblox Game Dev
Your Average Roblox Game Dev

Posted on

Setting Text Alignment in html for Text, Buttons, ECT.

Do you ever wonder why text-alignment never works in HTML code?

Well there's two reasons to why this happens.

  1. You probably used a DIFFERENT type of code on accident. To prevent this from happening do this before you start typing:
<!DOCTYPE HTML>
Your-code
Enter fullscreen mode Exit fullscreen mode

In "<!DOCTYPE HTML>", the HTML let's the HTML file know what version of *HTML" you are using.

  1. You probably tried to do this:
<!DOCTYPE HTML>
<html>
  <head></head>
  <body>
    <button> <!-- I'm using button, use whatever you want. -->
      <style>
        button{ <!-- using "button" Is the biggest mistake that you can accidentally make -->
               text-alignment: whatever-position-you-chose;
             }
      </style>
    </button>
  </body>
</html>
Enter fullscreen mode Exit fullscreen mode

NEVER use text alignment by itself. If you do you text alignment by itself it will NOT work.

Instead of doing that do this:

<!DOCTYPE HTML>
<html>
  <head></head>
  <body>
    <style>
      btn { <!-- change btn to the nickname for your div class. -->
         text-alignment: whatever-position-you-chose;
        }
    </style>
    <div class="btn">
      <!-- "class" gives a nickname for it's only child. "btn" is the nickname I gave for the button. You can choose any nickname for your text. -->
      <button>your text here</button>
    </div>
    <style>
    </style>
  </body>
</html>
Enter fullscreen mode Exit fullscreen mode

Tutorial for the most liked comment. 3 days to run it up🔥

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (2)

Collapse
 
veshremyfan profile image
Veshremyfan •

Pls do how to set the style of a button pls pls pls. 🙏🙏🙏

Collapse
 
joemama123 profile image
Your Average Roblox Game Dev •

Fine

Sentry image

Make it make sense

Make sense of fixing your code with straight-forward application monitoring.

Start debugging →

đź‘‹ Kindness is contagious

Dive into this informative piece, backed by our vibrant DEV Community

Whether you’re a novice or a pro, your perspective enriches our collective insight.

A simple “thank you” can lift someone’s spirits—share your gratitude in the comments!

On DEV, the power of shared knowledge paves a smoother path and tightens our community ties. Found value here? A quick thanks to the author makes a big impact.

Okay