Click here for the CSS code snippet
Hello everyone, this is my very first query on Stack Overflow. I know it might be a simple question but it's my first time posting here so kindly bear with me.
Below is the CSS code snippet provided:
*{
box-sizing: border-box;
margin: 0;
padding: 0;
}
body{
display: flex;
flex-direction: column;
}
#header{
background-color: cyan;
border: 1px inset black;
display: flex;
align-items: center;
margin: 0 auto;
}
#header ul{
list-style: none;
display: flex;
padding: 10px;
}
#header a{
text-decoration: none;
padding: 5px;
}
#heading{
font-size: 25px;
margin: 0 auto;
}
#left-content ul{
display: flex;
flex-direction: column;
padding-left: 20px;
background-color: yellow;
}
#left-content a{
text-decoration: none;
}
#right-content{
background-color: #f04e0f;
}
I am seeking guidance on how to make the header section, which is the top portion of the webpage, occupy the full width using the properties display: flex; and flex-direction: column...
Your suggestions are greatly appreciated as I am unsure of the next steps to take. Thank you in advance for your help.