MelonLand Forum

World Wide Web => ✁ ∙ Web Crafting => ☔︎ ∙ Help & Tutorials => Topic started by: SilkSkull on October 02, 2022, 04:47:13 am

Title: How to allign
Post by: SilkSkull on October 02, 2022, 04:47:13 am

How do I align my text the the centre of a page? I know that it involves CSS but I can't figure out how to work <stlye> for the life of me, here is my code as of now:

https://ibb.c:ha:7XHkqjf

Title: Re: How to allign
Post by: MamboGator on October 02, 2022, 05:36:50 am

If you just want to centre-align the text itself, add style="text-align: center;" to your HTML element that holds the text (<div>, <p>, etc.)

If you want to centre an element horizontally on the page, like a <div>, you can do so by setting a width that's less than 100% of its parent container and then adding style="margin: 0 auto;".

Those are the two easiest solutions to the most common use cases. There are a lot of different ways to position things on the page, but since you're just starting out you probably don't want to get into flex or grid yet.

Title: Re: How to allign
Post by: SilkSkull on October 02, 2022, 05:45:54 am

Quote from: MamboGator on October 02, 2022, 05:36:50 am

If you just want to centre-align the text itself, add style="text-align: center;" to your HTML element that holds the text (<div>, <p>, etc.)

If you want to centre an element horizontally on the page, like a <div>, you can do so by setting a width that's less than 100% of its parent container and then adding style="margin: 0 auto;".

Those are the two easiest solutions to the most common use cases. There are a lot of different ways to position things on the page, but since you're just starting out you probably don't want to get into flex or grid yet.

So I followed what you said and it is still sticking to the left side of the page, did I enter the <style> tag wrong?

My New Code:
https://ibb.c:ha:7XHkqjf

Site:
https://ibb.c:ha:vQSp0Fb

Title: Re: How to allign
Post by: Gans on October 02, 2022, 08:01:21 am

There is a <center>...</center> tag.
It's obsolete, but it works.
https://www.w3.org/TR/html401/present/graphics.html#edef-CENTER

Title: Re: How to allign
Post by: Melooon on October 02, 2022, 02:21:35 pm

Quote from: SilkSkull on October 02, 2022, 05:45:54 am

My New Code:
https://ibb.c:ha:7XHkqjf

I think thats the same code image you posted already :omg:k: (You could also paste the code here in code tags)

Code

like this

Title: Re: How to allign
Post by: SilkSkull on October 02, 2022, 04:21:14 pm

Thank you guys for all the help! Turns out I'm a little dumb lol. Also should it work the same with aligning to the left and right?