top lines and header

Demonstrate your product attractively using clean and distinctive coffe shop Joomla template.
GK User
Tue May 14, 2013 10:47 pm
Hi
I wish to remove the "second row" line, above "home". Picture file name is : top_lines.png

Also I would like to chance size of header one and two, one smaller and one bigger. Can't find any px numbers in firebug...

Thanks in advance
User avatar
Senior Boarder

GK User
Wed May 15, 2013 7:21 am
We cannot see this second line in demo website, can you please post a link to your website so we can check.

See you around...
User avatar
Platinum Boarder

GK User
Wed May 15, 2013 7:32 am
User avatar
Senior Boarder

GK User
Wed May 15, 2013 7:41 am
Please remove following lines and add last css code in to templates/gk_coffe/css/override.css and enable css override option in template settings > advanced settings > css override "on".

Please remove following lines of css code

style2.css line 30
Code: Select all
#gkPageTop > span:first-child {
    background-position: left 25px;
}


Template.css line 129
Code: Select all
#gkPageTop > span:first-child {
    background-position: left 25px;
}


Please change 20% and 77% as your requirement.
Code: Select all
#gkHeaderModule1 {width: 20%;}
#gkHeaderModule2 {width: 77%;}


See you around...
User avatar
Platinum Boarder

GK User
Wed May 15, 2013 10:39 am
Thanks!! The line is gone. :D
But... Can't figure out to change the size of headers. Where do I go wrong in override.ccs


# Support: [email protected]
*/
{
#gkHeaderModule1 {width: 20%;}
#gkHeaderModule2 {width: 77%;}

Thanks again!

// R
User avatar
Senior Boarder

GK User
Wed May 15, 2013 10:53 am
You need to adjust sizes based on your requirement.

Default is Left 20% right 77%. 3% gap is left between each side for design purposes.
Code: Select all
#gkHeaderModule1 {width: 20%;}
#gkHeaderModule2 {width: 77%;}

http://awesomescreenshot.com/00619xvg87

Example left 70%, right 27%
Code: Select all
#gkHeaderModule1 {width: 70%;}
#gkHeaderModule2 {width: 27%;}

http://awesomescreenshot.com/04419xvv1e

Example 50% for each side.
Code: Select all
#gkHeaderModule1, #gkHeaderModule2  {width: 50%;}

http://awesomescreenshot.com/00819xw3e1

Let me know if you need further help. See you around...
User avatar
Platinum Boarder

GK User
Wed May 15, 2013 11:07 am
?? not working!
#gkHeaderModule1 {width: 70%;}
#gkHeaderModule2 {width: 27%;}
is understood. But I'm afraid it is the setting of {/* that goes wrong.... Between gavic.com and #...



#
# Copyright (C) 2007-2011 Gavick.com. All Rights Reserved.
# License: Copyrighted Commercial Software
# Website: http://www.gavick.com
# Support: [email protected]
*/
#gkHeaderModule1 {width: 70%;}
#gkHeaderModule2 {width: 27%;}


Sorry for the trouble.

// R
User avatar
Senior Boarder

GK User
Wed May 15, 2013 11:07 am
Please use !important tag in your css as previous css overrides your current code.

Code: Select all
#gkHeaderModule1 {
    width: 70%!important;
}
#gkHeaderModule2 {
    width: 27%!important;
}


No troubles at all, See you around ;)
User avatar
Platinum Boarder

GK User
Wed May 15, 2013 11:30 am
And it works perfectly! Thanks :)
User avatar
Senior Boarder

GK User
Wed May 15, 2013 11:34 am
No problem at all, let us know if you need any further help. See you around...
User avatar
Platinum Boarder


cron
Remember me
Register New Account
If you are old Gavick user, click HERE for steps to retrieve your account.