The correct CSS to float main menu to left side.

[ahd904]

Hello team and @Laura,

Could you guide me with the correct CSS to shift the main menus to the left apart from the KLEO account menu as indicated in the attached screen shot ?

Thank you.

Attachments:

You must be logged in to view attached files.

[ahd904]

By the way the site url is http://www.ibyi.co.kr

Thank you

[Radu]

Try like this

COPY CODE

.kleo-main-header .navbar-collapse {
  float: left !important;
}

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ahd904]

Thank you @Radu but what i wanted is to make the My Account menu and the notifications from KLEO menu items to stay on the right.

Please refer to the attached image,

Could you also provide the correct CSS to make this happen ?

Thank you again,

Attachments:

You must be logged in to view attached files.

[Radu]

Hello,

Please replace css code that I gave you before with these

COPY CODE

.kleo-main-header .navbar-collapse {float:none !important;} 
.kleo-main-header .nav.navbar-nav {float:none !important;}
#header.header-color .navbar-nav li:last-child {float:right;}

Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ahd904]

@Radu,

I am still not getting the ‘My Account’ menu to float on the right side with the last child.

Can you please finish off helping this one ?

Radu, also could you tell me how can i find the exact CSS selector ? do you also use chrome tool (F12) or is there something else that you recommend ?

[ahd904]

#header.header-color .navbar-nav > #menu-item-3400 {float:right;}

i have tried this and My acoount floats to the right but i want it to be before the little Android (notification menu).

CSS is easy and hard unless i know the rules clearly.

Could you make a clear CSS for fixing all this above correctly ?

Thank you for the kind support.

[ahd904]

At the moment i have applied back to the last CSS you have given me so that you dont get confused.

COPY CODE

.kleo-main-header .navbar-collapse {float:none !important;} 
.kleo-main-header .nav.navbar-nav {float:none !important;}
#header.header-color .navbar-nav li:last-child {float:right;}

[Radu]

Apply this css please

COPY CODE

.kleo-main-header .navbar-collapse {float:none !important;} 
.kleo-main-header .nav.navbar-nav {float:none !important;}
#header.header-color .navbar-nav li:last-child {float:right !important;}

#header.header-color .navbar-nav li:last-child ul.dropdown-menu {
right:0 !important;
left:auto !important;
}

Let me know if it works.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ahd904]

This reply has been set as private.

[Radu]

Hello,

Load this css it should works.

COPY CODE

.kleo-main-header .navbar-collapse {float:none !important;} 
.kleo-main-header .nav.navbar-nav {float:none !important;}
#header.header-color .navbar-nav > li:last-child {float: right !important;}
.kleo-main-header .navbar-nav .kleo-user_avatar-nav {float:right !important;}

Let me know if it works.

Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[ahd904]

@Radu

One fix is still remaining that i want to move the android icon (notification) rightside to the KLEO avatar.

Could you please refer to the attached image once more ?

The above CSS did not move the android icon to the rightside of that KLEO avatar.

Thank you.

Attachments:

You must be logged in to view attached files.

[Radu]

Hello,

Go to menus, select the actual main menu, and switch notification with my account, my account it should be last in the menu.

Thet’s all

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts