logo paddgin

**GK User** Wed Jun 11, 2014 9:36 pm Reply with quote Report this post

Hi,

i used this css in order to define full widh for the heade position:
http://www.gavick.com/documentation/joo ... th-module/
But now, the logo in the header menu bar have no left padding.
By css , for the .gklogoimage i tried to defined left margin, but this padding is also added in the logo that is showen in the menu bar when i scroll down while i want to define it only for the header in order to have the same padding when i scroll down.
Just check www.developer.upyourface.com, u will understood
thanks

**GK User** Thu Jun 12, 2014 5:57 am Reply with quote Report this post

The key is a correct selector:

Code: Select all: #gkHeader #gkLogo {margin-left: 50px;}

**GK User** Fri Jun 13, 2014 8:39 pm Reply with quote Report this post

Hi, it works but it shift it for mobile too..

**GK User** Mon Jun 16, 2014 6:04 pm Reply with quote Report this post

Sadly, I can't access your site - is it live?

**GK User** Thu Jun 19, 2014 9:13 am Reply with quote Report this post

Please edit: /templates/gk_simplicity/css/override.css and add at its end:

Code: Select all: #gkHeader #gkLogo {margin-left: 50px;} @media (max-width: 1024px) { #gkHeader #gkLogo {margin-left: 0px !important;} }

What it does - it adds 50px left padding for every device and removes it for those, with screen width less than 1024px

Remember to enable "CSS override" in template settings - advanced section.