After spending more than two months learning HTML, I still find myself uncertain about the most practical coding approach. Despite knowing that it's important not to overthink it, I often wonder if I should stick with simplicity or add extra elements for styling flexibility.
For instance, in the code snippet below, is it necessary to include div id="header" when there is already a header class="header"? I noticed that some websites, like those on Freecodecamp, use non-semantic div tags to wrap semantic elements like headers. Should I follow this practice just for consistency?
In terms of CSS, I haven't styled anything specifically for the div id="header". That makes me question whether having an additional div tag adds unnecessary complexity to the code. Would fewer tags and cleaner code ultimately lead to better readability and maintainability?
.logo {
margin: 20px 0 0 20px;
}
.logo img {
max-width: 230px;
}
header {
display: flex;
font-weight: 700;
font-family: Arial, Helvetica, sans-serif;
color: #fff;
justify-content: space-around;
align-items: baseline;
}
