Return to previous page

Change background color of header and restructure

This topic has 11 replies, 2 voices, and was last updated 6 years, 5 months ago ago by Rose Tyler

spallsport

Participant

June 15, 2018 at 09:34

Hi, I try to change de color of header in them options but I dont see any change, I need the same pantone black color of my logo, where can I change the color?
And in other topic I asked you to change the size of header. But don´t run correctly.
I need that the logo will be more than left and the contact info only in one line, no in two, is possible? https://prntscr.com/jv8bsn
Thanks

#194964 Copied

10 Answers
Rose Tyler

Support staff

June 15, 2018 at 10:07
Hello,

Please change this code https://image.prntscr.com/image/h9_jjnKeQgKLwUGcwVgwsw.png to
```
.header .contact-us {
    margin-top: 14%;
    margin-right: 0px;
}
```
add this https://image.prntscr.com/image/hd9dI8ZIQJ6KGGX5XL4RGg.png
to
```
@media (min-width: 1290px) {
   .header .container {
       width: 1300px;
   }
   .header2 .logo {
       width: auto;
   }
}
```
Regards
#194968 Copied
Rose Tyler

Support staff

June 15, 2018 at 10:12
Also, please, use this code to change bg color of header:
```
.header-wrapper, .page-wrapper .header .container, .page-wrapper .main-nav .container {
    background-color: black;
}
```
Regards
#194969 Copied
spallsport

Participant

June 15, 2018 at 10:14

Sorry but don´t anything…
And the colour?

#194970 Copied
Rose Tyler

Support staff

June 15, 2018 at 13:13
Have you changed the code?
To set color of header:
```
.header-wrapper, .page-wrapper .header .container, .page-wrapper .main-nav .container {
    background-color: black;
}
```
Regards
#194982 Copied
spallsport

Participant

June 15, 2018 at 13:16

thanks, but this code dont change anything in my header…
@media (min-width: 1290px) {
.header .container {
width: 1300px;
}
.header2 .logo {
width: auto;
}
}

#194983 Copied
Rose Tyler

Support staff

June 15, 2018 at 13:27
Please change this code:
```
.header .contact-us {
    margin-top: 6%;
    margin-left: 1%;
}
```
to
```
.header .contact-us {
    margin-top: 14%;
    margin-right: 0px;
}
```
and this:
```
@media (min-width: 1290px) {
.header .container {
    width: 1300px;
}
}
```
to
```
@media (min-width: 1290px) {
   .header .container {
       width: 1300px;
   }
   .header2 .logo {
       width: auto;
   }
}
```
For now, I do not see these changes on your site.

Regards
#194987 Copied
spallsport

Participant

June 18, 2018 at 08:58

Hi I change the codes, but I would the logo more than left and contact info too.
And I can´t change the color of background of this header.
Thanks

#195029 Copied
Rose Tyler

Support staff

June 18, 2018 at 13:38
Hello,

I’ve changed the previous code https://image.prntscr.com/image/DF6XA6YiQBmijpg4vz6vcQ.png Please clear cache and check now.
About the background color, I do not see that you added this code:
```
.header-wrapper, .page-wrapper .header .container, .page-wrapper .main-nav .container {
    background-color: black;
}
```
Have you tried the same code with !important; ?

Regards
#195069 Copied
spallsport

Participant

June 18, 2018 at 15:38

perfect and perfect!!!
thanks!

#195099 Copied

Rose Tyler

Support staff

June 18, 2018 at 15:53

You’re welcome!

Regards

#195101 Copied
Viewing 11 results - 1 through 11 (of 11 total)