Coolest Guides on the Planet

coolest guides on the planet

Coolest Guides On The Planet

  • Home
  • macOS
  • WebDev
  • All Posts
  • Contact

Genesis Menu Item with Float Right, Drops in Chrome

August 14, 2014 Leave a Comment

Genesis has a nifty CSS class named .right which when applied to a Menu Item will float that particular item to the right and keep the other menu items to the left. You need to apply the menu items in the correct way for it to work in Chrome.

Applying the Float to Menu Items

genesis-menu-float-right

In Appearance >Menus, make sure in screen options the CSS Classes option is checked.

genesis-menu-class-right

Then apply the class right to the Menu Items you want floated right.

Float Right Issue in Chrome

genesis-float-right-menu-chrome

Not on the same line length

 

If you get an issue in Chrome where by the floated menu breaks out of the menu block to a new line, it is because Chrome sometimes renders the page before the float is applied, subsequent clicks on other pages render the page ok but the initial page load is incorrect.

This doesn’t occur at all like that in Firefox or IE.

How to fix is to reorder the menu items so the floated items go first in the menu list.

genesis-menu-right-first

Place the Floated Items first in the menu.

 

genesis-menu-right-restored

Order is restored

Cats: WordPress

Tags

3gs 10.6 apache backup baseband boot clean urls cpanel css curl custom database drupal el capitan git Google image instadmg ios iphone jailbreak keys lion mac macos mojave macos sierra menu mysql OSX panda php phpmyadmin private public redirect redsn0w remote rsa SEO shell ssh terminal unstoppables upgrade urls

Donate a Beer to the Coolest Guides

Get Beaver Builder Now!

Discuss

3gs 10.6 apache backup baseband boot clean urls cpanel css curl custom database drupal el capitan git Google image instadmg ios iphone jailbreak keys lion mac macos mojave macos sierra menu mysql OSX panda php phpmyadmin private public redirect redsn0w remote rsa SEO shell ssh terminal unstoppables upgrade urls
Get DesktopServer

Lynda

Lynda.com Online Training Videos

TreeHouse

smlinks

Learn WordPress
osx-modify-shell-path

How to Add to the Shell Path in macOS Big Sur and Catalina using Terminal

October 19, 2019

virtual-hosts osx 10.10 yosemite

Set up Virtual Hosts on macOS Catalina 10.15 in Apache

October 19, 2019

Installing Homebrew on macOS Catalina 10.15, Package Manager for Linux Apps

October 18, 2019

Where is the bash shell in macos Catalina?

October 12, 2019

Refine your search

  • All
  • Modules
  • Themes
  • Documentation
  • Forums & Issues
  • Groups

RSS feed: ars technica ars technica

  • Apple One and Apple TV subscription prices increase by up to 20 percent
  • Vulnerability giving attackers full control of Macs is under active exploitation
  • OpenAI says Apple's trade secrets lawsuit is "aggressive and oddly personal"
  • Tim Cook passes the baton in Apple's Q3 2026 earnings call
  • San Francisco orders Apple, Google to remove nudify apps from app stores

RSS feed: mac surfer mac surfer

  • iPhone Ultra Production Stuck at Hundreds Per Day
  • HomePod Gains Four-Speaker Surround Sound in Code
  • Leaked A20 Pro Chip Diagram Points to Major GPU Gains
  • iOS 27 Introduces iPhone Handoff to Share One Number Across Two iPhones
  • Oklahoma Adds Apple Wallet Driver's License Support

Donate

Copyright © 2026· Neil Gee - All Rights Reserved - Hosted by Runcloud

Copyright © 2026 · gee on Genesis Framework · WordPress · Log in