Jump to content

HTML "<div class>" Thingy....

Go to solution Solved by vorticalbox,

So can someone explain to me what's this actually?

When I was making a website someone told me to put this:

<div class="XXXXXX"><div class="container"> </div></div>

After <div class="container"> is the content.

 

What do <div class="___"> and <div class="container"> do in HTML?

Is this "container" a must or optional? Because after the first <div class="__"> there's always <div class="container">.

 

I'm a beginner.

 

<div> is a division on the page or section.

 

the class allows you to apply styling, if you want some things to be centred you make a centre class in your CSS

.centre{text-align: center;} 

this would allow you to style any text to the centre using the class tag

<p class='centre'>text</p><h1 class='centre'>text</h1>

container is just another class.

.container{width: 80%;height: 500px;} 

would make the div 80% of the window width and 500 pixels high.

So can someone explain to me what's this actually?

When I was making a website someone told me to put this:

<div class="XXXXXX"><div class="container"> </div></div>

After <div class="container"> is the content.

 

What do <div class="___"> and <div class="container"> do in HTML?

Is this "container" a must or optional? Because after the first <div class="__"> there's always <div class="container">.

 

I'm a beginner.

Where I hang out: The Garage - Car Enthusiast Club

My cars: 2006 Mazda RX-8 (MT) | 2014 Mazda 6 (AT) | 2009 Honda Jazz (AT)


PC Specs

Indonesia

CPU: i5-4690 | Motherboard: MSI B85-G43 | Memory: Corsair Vengeance 2x4GB | Power Supply: Corsair CX500 | Video Card: MSI GTX 970

Storage: Kingston V300 120GB & WD Blue 1TB | Network Card: ASUS PCE-AC56 | Peripherals: Microsoft Wired 600 & Logitech G29 + Shifter

 

Australia 

CPU: Ryzen 3 2200G | Motherboard: MSI - B450 Tomahawk | Memory: Mushkin - 8GB (1 x 8GB) | Storage: Mushkin 250GB & Western Digital - Caviar Blue 1TB
Video Card: GIGABYTE - RX 580 8GB | Case: Corsair - 100R ATX Mid Tower | Power Supply: Avolv 550W 80+ Gold

 

Link to comment
https://linustechtips.com/topic/374086-html-div-class-thingy/
Share on other sites

Link to post
Share on other sites

It's very much optional.

You can use those div's to edit specific spaces of your website with css (like make all text in 'XXXXXX' red and make all the text in 'container' blue)

"We're all in this together, might as well be friends" Tom, Toonami.

 

mini eLiXiVy: my open source 65% mechanical PCB, a build log, PCB anatomy and discussing open source licenses: https://linustechtips.com/topic/1366493-elixivy-a-65-mechanical-keyboard-build-log-pcb-anatomy-and-how-i-open-sourced-this-project/

 

mini_cardboard: a 4% keyboard build log and how keyboards workhttps://linustechtips.com/topic/1328547-mini_cardboard-a-4-keyboard-build-log-and-how-keyboards-work/

Link to comment
https://linustechtips.com/topic/374086-html-div-class-thingy/#findComment-5060216
Share on other sites

Link to post
Share on other sites

The stuff within the quotes ("Container" for example) can be whatever you want it to be, just know what you set it to in case you need to use it for something. (Such as assigning formatting things in a CSS file)

Specs: CPU - Intel i7 8700K @ 5GHz | GPU - Gigabyte GTX 970 G1 Gaming | Motherboard - ASUS Strix Z370-G WIFI AC | RAM - XPG Gammix DDR4-3000MHz 32GB (2x16GB) | Main Drive - Samsung 850 Evo 500GB M.2 | Other Drives - 7TB/3 Drives | CPU Cooler - Corsair H100i Pro | Case - Fractal Design Define C Mini TG | Power Supply - EVGA G3 850W

Link to comment
https://linustechtips.com/topic/374086-html-div-class-thingy/#findComment-5060220
Share on other sites

Link to post
Share on other sites

So can someone explain to me what's this actually?

When I was making a website someone told me to put this:

<div class="XXXXXX"><div class="container"> </div></div>

After <div class="container"> is the content.

 

What do <div class="___"> and <div class="container"> do in HTML?

Is this "container" a must or optional? Because after the first <div class="__"> there's always <div class="container">.

 

I'm a beginner.

 

<div> is a division on the page or section.

 

the class allows you to apply styling, if you want some things to be centred you make a centre class in your CSS

.centre{text-align: center;} 

this would allow you to style any text to the centre using the class tag

<p class='centre'>text</p><h1 class='centre'>text</h1>

container is just another class.

.container{width: 80%;height: 500px;} 

would make the div 80% of the window width and 500 pixels high.

                     ¸„»°'´¸„»°'´ Vorticalbox `'°«„¸`'°«„¸
`'°«„¸¸„»°'´¸„»°'´`'°«„¸Scientia Potentia est  ¸„»°'´`'°«„¸`'°«„¸¸„»°'´

Link to comment
https://linustechtips.com/topic/374086-html-div-class-thingy/#findComment-5060298
Share on other sites

Link to post
Share on other sites

<div> is a division on the page or section.

 

the class allows you to apply styling, if you want some things to be centred you make a centre class in your CSS

.centre{text-align: center;} 

this would allow you to style any text to the centre using the class tag

<p class='centre'>text</p><h1 class='centre'>text</h1>

container is just another class.

.container{width: 80%;height: 500px;} 

would make the div 80% of the window width and 500 pixels high.

So class is to tag? So when we edit it more using CSS any text that's in the "Class" will be affected, am I correct?

Where I hang out: The Garage - Car Enthusiast Club

My cars: 2006 Mazda RX-8 (MT) | 2014 Mazda 6 (AT) | 2009 Honda Jazz (AT)


PC Specs

Indonesia

CPU: i5-4690 | Motherboard: MSI B85-G43 | Memory: Corsair Vengeance 2x4GB | Power Supply: Corsair CX500 | Video Card: MSI GTX 970

Storage: Kingston V300 120GB & WD Blue 1TB | Network Card: ASUS PCE-AC56 | Peripherals: Microsoft Wired 600 & Logitech G29 + Shifter

 

Australia 

CPU: Ryzen 3 2200G | Motherboard: MSI - B450 Tomahawk | Memory: Mushkin - 8GB (1 x 8GB) | Storage: Mushkin 250GB & Western Digital - Caviar Blue 1TB
Video Card: GIGABYTE - RX 580 8GB | Case: Corsair - 100R ATX Mid Tower | Power Supply: Avolv 550W 80+ Gold

 

Link to comment
https://linustechtips.com/topic/374086-html-div-class-thingy/#findComment-5060305
Share on other sites

Link to post
Share on other sites

So class is to tag? So when we edit it more using CSS any text that's in the "Class" will be affected, am I correct?

Yes it allows you to add the same style to everything in that class. so if you wanted all <p>text</p> to be left aligned, green and underlined you would create the class then <p class='name'> </p> .

                     ¸„»°'´¸„»°'´ Vorticalbox `'°«„¸`'°«„¸
`'°«„¸¸„»°'´¸„»°'´`'°«„¸Scientia Potentia est  ¸„»°'´`'°«„¸`'°«„¸¸„»°'´

Link to comment
https://linustechtips.com/topic/374086-html-div-class-thingy/#findComment-5060333
Share on other sites

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×