Joomla Templates Club 406,261 posts

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1000209

Hi
For hover add below code in custom.css file and replicate the same for other buttons
The 2nd code is to add background color in mobile, increase the width of buttons to give them same look like calendar button.

.head-right-item.head-links .nav > li > a.btn-group:hover:after{color: #649130;}

@media (max-width: 767px){.head-right-item.head-links .nav > li > a.btn-group {   background: #575757;}}

Regards

1 user says Thank You to Pankaj Sharma for this useful post

1. buiak

[buiak Friend buiakJoin date: August 2016Posts: 124Downloads:74Uploads:24 Thanks: 16]

#1000221

thank you for your kind support !
Please check the website, and advice how can I reduce the padding to make them stay in the same line align also on mobile view the gap between them are to high and make the last icon button to be under logo. please advice with my last request about this styling css.

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#1000232

Hi
open /tpls/blocks/mainnav.php file
find

        <div class="col-xs-8 col-md-6 col-lg-3 pull-right">

Replace it with

        <div class="col-xs-8 col-md-6 col-lg-4 pull-right">

For padding add below code in custom.css file

@media (max-width: 767px) {.head-right-item.head-links .nav > li {  padding-right: 10px; }}

Regards

1 user says Thank You to Pankaj Sharma for this useful post

1. buiak

[buiak Friend buiakJoin date: August 2016Posts: 124Downloads:74Uploads:24 Thanks: 16]

#1000244

ITS PERFECT !!!!!!!!
THANK YOU AGAIN !!!!!!!

[Author]

Posts