Why in this code that I am trying to model after:
<section id="about" class="section section-about section-about-1 pp-scrollable">
<div class="container about-me-text-container">
Is there so many nested divs? What is the point of nesting so many divs?
Well there are a number of reasons you could nest
<div> is not a semantic element it is usually used to group together several elements for styling or interactivity.
<header> of the forums (community theme) for example, there are about three layers of
<div> within it to get down to the basic elements such as the
<img> that holds you profile picture. The purpose of these is to style each related “box” of elements differently, moving them into the exact right area that is desired. Such as the search Home and Catalog button.
Or take the boxes used to hold our posts. Using developer tools take a look at how many nested
<div>s there are:
Each being used to either add interactivity, or to place each individual item in the exact right spot.
Ok thanks for clearing that up!
I am still confused how you would know how many divs to nest when you are starting to write out a website. It seems like something that is guess and check and changed over the course of making the website.
Also I got the code from this website: https://www.davidelee.net/#intro
I asked a similar question somewhere else and someone said it was a bootstrap site. Does boostrap write out the divs for you?
It really depends on your style of designing, some are able to plan their entire website out and know everything they will need in the beginning.
Some (I’m in this group) will get a basic idea about what they want and know about what they need. They can then start with the basic layout and slowly work everything (such as extra
<div>s) into the code.
While others get an idea and just start writing code.
All of these can end up with a beautiful finished project, and these certainly don’t cover EVERYONE’S individual styles. Some say coding is an art, and as such styles vary with personality.
No, but since it styles each element based on its class, you may need several
<div>s to act as each object you want.
Ok thanks for the information, I can tell you are very knowledgeable.
Thank you for the compliment, though I am still a learner like you.
The best way to think about Bootstrap is as a collection of components, as well as pre-determined typeface styles.
Say you want a carousel to cycle through customer testimonials - there’s a component for that.
Want to incorporate a toast on your website - there’s a component for that.
Want a spinny loading indicator? Yup, there’s a component for that too.
There’s a lot more info on the components in the Bootstrap docs.