Can somebody explain to me what’s the function of <div
1 Like
It groups elements into a section so you can style (CSS) or program (JS) whatever is contained inside as a group. It’s especially useful for positioning elements on the page. Besides positioning elements as a group, it gives inline elements, such as an image or input field, a block-level container.
Div is a generic container name. HTML5 has more specific container names: header, section, article, footer, etc. that you can use. The names are just to make it easier on us to distinguish among all those containers.
2 Likes
You can change the height and width of a div and add a background color, to for instance, create a box. Then you can put stuff into that box and group it.
As @jlave said, its basically a container.
Here is a example on google search. This div holds multiple boxes. It groups them together and contains them.
(the <a class="mv-empty-tile"></a> are the boxes).
Thanks. Couldn’t I use id= instead of div?
Can i actually google a list of class=?
You have lots of toys, candies and random things.
It’s a total mess, what do you do?
You put them in a box.
Same with HTML and elements…the div is your box, use it.
1 Like
Yeah you can give it a class like anything else. All it is a container and box. Its like a secondary body element.
No, they’re different types of things. A <div> is an HTML element, an id is an attribute. So you can use them both, like this: <div id="myId">content goes here</div>.
No, because the possible values of class include any arbitrary string (with certain validation rules and within any length limit imposed by the browser). You could have class="bdkjas--dsj_1ikf44uqwi" and that would be syntactically fine.
1 Like
You do not absolutely have to use divs, but they will make it easier to position things and style them.
As @razvanel666 said, you put things in them, like a box. Instead of toys and candies, you’re putting in headings, paragraphs, images, buttons, etc. You can put a bunch of things in one box/div, or you can put just one thing in it.
Think of the id/class as the label for the box. One box might be for toys (id=“toys”) and one for candies (id=“candies”). If you have several boxes/divs of the same type, you’d use a class (class=“books”). You can use both a class and an id on the same div, for example:
<div class=photos id ="cats">
<img src="cat in window.jpg" />
<img src="cat chasing red dot.jpg" />
<img src="cat on pillow.jpg" />
</div>
1 Like