badget

Biggest Sale! Special Offer!

Get 30% discount on all of our single themes with this coupon code: #30%SALE

Hurry up! *Limited time offer*
View all Themes

Floating some Nav-Items to the right

Tagged: ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • October 21, 2020 at 3:35 pm #82214
    George Kyriazis
    Participant

    Hey gang, classing the menu items and positioning them via relative pixels isn’t a proper way to push some nav items to the right ride. The float right CSS rule isnt working and I dont want to break responsivness.

    See screen – is it possible to move these imaged nav items to the right of the nav? http://prntscr.com/v3xu2t

    Ive tried everything and using pixels and left:400px isnt going to do it for all devices. I need to float just these to the right.

    Thanks in advance for the help on how to achieve this properly.

    October 22, 2020 at 6:32 pm #82265
    George Kyriazis
    Participant

    Any way I can do this properly? I dont want to break responsiveness. Thanks.

    October 23, 2020 at 4:52 am #82267
    George Kyriazis
    Participant

    I have tried everything. There is no getting a few nav items floating left properly. This is so frustrating. I even tried to introduce clear space with empty nav items and give it the same color as the background to create seperation and it cant get to the right side next to the search.

    So frustration. Can I please get some support.

    What do i gotta change in the style sheet to be able to float 3 custom classed nav items to the right near the search. Thanks.

    .navbar .main-navigation ul {
    padding-left: 0;
    }
    .main-navigation li {
    position: relative;
    list-style: none;
    display: inline-block;
    float: left;
    }
    .main-navigation a {
    color: #ffffff;
    display: block;
    padding: 15px;
    font-weight: 700;
    }
    .main-navigation a:hover {
    text-decoration: none;
    }

    October 23, 2020 at 4:59 am #82268
    George Kyriazis
    Participant

    The forum is glitching, to make sure you see my screenshot: https://ibb.co/qRMSFhc

    October 23, 2020 at 5:40 am #82266
    George Kyriazis
    Participant

    I have tried everything. Nothing makes these 3 menu items float right on the nav bar. I even tried to hard code in items on the editor. Nothing.

    Please see screenshot http://prntscr.com/v513n9 these are their ID’s

    I even tried to hack my way by adding space in imaged nav items like these http://prntscr.com/v514am

    Its not working because it will stack on smaller windows. How can I get some support on floating just these three items to the RIGHT on the main navbar. Thanks in advance. Its been 2 days now, hopefully I can get some guidance asap. Thanks.

    October 23, 2020 at 5:35 pm #82341
    George Kyriazis
    Participant

    Can anyone please help me? its very important.

    October 25, 2020 at 1:50 pm #82387
    Theme Horse Support Team
    Keymaster

    Hi George Kyriazis,

    Sorry for the late response due to some unavoidable circumstances. Yes please go to ‘Appearance > Customize > Additional CSS’ and paste the below Code.

    @media (min-width: 992px) {
	.navigation-bar .container {
		padding-right: 285px;
	}
	#menu-item-1749, #menu-item-1750, #menu-item-2614 {
		position: absolute;
		top: 0;
	}
	#menu-item-1749 {
		right: 75px;
	}
	#menu-item-1750 {
		right: 131px;
	}
	#menu-item-2614 {
		right: 186px;
	}
}
@media (max-width: 991px) {
	#menu-item-1749 > a img,
	#menu-item-1750 > a img {
		-webkit-filter: invert(.7);
  		filter: invert(.7);
	}
}

    Thanks

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.