Question 223203 in Html Question posted in
Some basic documentation can be found here.

Html – How to make a header the width of the entire page

I’m trying to figure out how to make the width of a header across the entire page. I want to do that and push the notifications section down. It currently cuts off as shown in the image below:

html

  <header>
    <div>
      <app-ao-logo>

      </app-ao-logo>
   </div>
  </header>

I updated css from this:

css

 header {
   margin:auto;
 }

to this:

header {
    width: 100vw;
}

This stretches the header but the Notifications section is not pushed down.

Tags:

2

Answers


  1. 0

    The best method is to use CSS to set the width of the element relative to page width:

    header {
  /* ... */
  width: 100vw;
}
    Login or Signup to reply.
  2. 0

    I would reccommend using grid
    This website has a bunch examples for you to take a look at:
    https://gridbyexample.com/examples/

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search