Public Forums 71,145 posts

[Alp Friend AlpJoin date: November 2015Posts: 145Downloads:396Uploads:12 Thanks: 10 Thanked: 2 times in 2 posts]

#933849

Hi,

where can I change the height of the search box in the mainnav?

Tnx in advance and best regards

Alp

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#933856

Hi

Add this to your custom.css file

.head-search .form-control {
height:yourheightpx!important;
}

Best regards

[Alp Friend AlpJoin date: November 2015Posts: 145Downloads:396Uploads:12 Thanks: 10 Thanked: 2 times in 2 posts]

#933896

ok this is fine of far, tnx a lot.

But how can I set search icon and search text higher?

http://prntscr.com/b7ku8x

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#934011

Add this to your custom.css

.head-search .search .fa-search {
top:12px!important;
}

change the value of 12px to change position

I will need of the website url to check other settings

[Alp Friend AlpJoin date: November 2015Posts: 145Downloads:396Uploads:12 Thanks: 10 Thanked: 2 times in 2 posts]

#934088

ok Tnx a lot for your help,

Search box is fine so far.

After reducing the size of the navbar to 40 pix I realized that the menu looks wrong on mobile.
As faar as I can see the menu is there, but since the text color is white, and the backgroundcolor of menu dissapear on mobile the menu points are not visible. This is the code of my custom.css:

/* MainNav Color */

.t3-mainnav {
background-color: #000;
}

/* MainNav Height */

@media screen and (min-width: 991px) {
.navbar-default .navbar-nav > li > a {
line-height: 40px;
}
}

.t3-mainnav {
height: 40px;
}

.t3-wrapper .navbar {
height: 40px;
min-height: 40px;
}

body {
padding-top: 40px;
}

@media (max-width: 767px) {

.navbar-toggle {
height: 40px;
line-height: 40px;
}

.t3-mainnav .t3-navbar-collapse {
margin-top: 40px;
}

}

.navbar-toggle {
height: 40px;
line-height: 40px;
width: 40px;
}

.t3-mainnav .t3-navbar-collapse {
margin-top: 40px;
}

/* Searchbox Height */

.head-search .form-control {
    height:40px;
}

.head-search .search .fa-search { 
  top:9px; 
} 

/* Mega Menu Firstlevel Sub */

  li.firstlevel > a {
    color :red;
}

[Alp Friend AlpJoin date: November 2015Posts: 145Downloads:396Uploads:12 Thanks: 10 Thanked: 2 times in 2 posts]

#934089

This reply has been marked as private.

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#934095

Alp wrote:

Website URL is: http://www.tahtapod.com[/quote]

Your menu looks fine on mobile

could you post a screenshot of which problems you are having exactly ?

[Alp Friend AlpJoin date: November 2015Posts: 145Downloads:396Uploads:12 Thanks: 10 Thanked: 2 times in 2 posts]

#934109

This reply has been marked as private.

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#934154

Hi there

Your changes seems to be correct but for some reason your template seems to be cached and doesn’t load correctly custom.css

If you have some cacher manager on your hosting like supercacher then flush the whole website cache

[Alp Friend AlpJoin date: November 2015Posts: 145Downloads:396Uploads:12 Thanks: 10 Thanked: 2 times in 2 posts]

#934167

This reply has been marked as private.

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#934255

This reply has been marked as private.

1 user says Thank You to pavit for this useful post

1. Alp

[Alp Friend AlpJoin date: November 2015Posts: 145Downloads:396Uploads:12 Thanks: 10 Thanked: 2 times in 2 posts]

#935142

I Just saw your reply.
That was it.

Thank you very much.

[Author]

Posts