how to add notification bar under header

April 28, 2023

First of all i am new to css and i want a black notification bar right under header for free shipping, and the text will be white. This should be full width to browsers

i tried to do it with css and heade::after but my text stays on left corner and can not be centered

header::after {
  content: "test test text";
    margin: 0 -9999rem;
  /* add back negative margin value */
  padding: 0.25rem 9999rem;
  background: #101010;
    color: #ffffff;
}

>Solution :

I don’t understand the reason for those weird paddings and margins but simply text-align:center along with display:block should work.

header::after {
  content: "test test text";
   margin: 0 -9999rem;
  /* add back negative margin value */
  padding: 0.25rem 9999rem;
  background: #101010;
  color: #ffffff;
  text-align:center;
  display:block;
}