Insert a red bar over header

Site URL: https://clownfish-orca-n5ml.squarespace.com/

Hi,

i would like to insert a 30px height red bar over header with custom css.

i've tryed with this code but the result is not what i want.

#header {
  content:'';
  display:block;
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:30px;
  background-color:red;
}

i would like to push all the content dow

i've tryed adding ::before but it doesn't work

#header::before {
  content:'';
  display:block;
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:30px;
  background-color:red;
}

Can anyone help me please ?

Cheers

2 hours ago, Studio-XS said:

Site URL: https://clownfish-orca-n5ml.squarespace.com/

Hi,

i would like to insert a 30px height red bar over header with custom css.

i've tryed with this code but the result is not what i want.

#header {
  content:'';
  display:block;
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:30px;
  background-color:red;
}

i would like to push all the content dow

i've tryed adding ::before but it doesn't work

#header::before {
  content:'';
  display:block;
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:30px;
  background-color:red;
}

Can anyone help me please ?

Cheers

You can try adding Design > Custom Css

#header {
  background-color: unset;
}

#header .header-announcement-bar-wrapper {
  background: red;
}

Thanks for your answer but the result is not what i want.

I would like to add a 30px red bar before the header section and push all the page content down, not only make a red header background.

The code i would like to find has to mantain the announcement bar functionality untouched so i can activate and deactivate from the straight setup ...and the red bar i add has to be hided when the viewport change at smaller size 

2 hours ago, Studio-XS said:

Thanks for your answer but the result is not what i want.

I would like to add a 30px red bar before the header section and push all the page content down, not only make a red header background.

The code i would like to find has to mantain the announcement bar functionality untouched so i can activate and deactivate from the straight setup ...and the red bar i add has to be hided when the viewport change at smaller size 

Can i check it again? Your site is not valid at this moment