Extremely simple one-level drop-down menu using CSS

The CSS below styles an unordered list with nested sub-lists as a horizontal menu with drop-down sub-menus (only one level). I tried to keep the code minimal with no effort for good looks. You can add your own styling as you like.

I have tested this successfully in IE8, IE9 and recent versions of Firefox, Chrome, Safari and Opera. I consider IE6 and IE7 broken beyond repair and basically ignore them.

Please test it in your browser at http://jsfiddle.net/Yk6MS/4/, and let me know about any problems you might find.

Style sheet:

.menu,
.menu ul {
  background-color: tan;
}
.menu > li {
  display: inline-block;
  white-space: nowrap;
}
.menu ul {
  position: absolute;
  display: none;  
}
.menu > li:hover {
  position: relative;
}
.menu > li:hover ul {
  display: block;
}

Example HTML:

<ul class="menu">
  <li>Abra
     <ul>
      <li>Amfdf rt</li>
      <li>Brr zz</li>
     </ul>
  </li>
  <li>Kadabra
     <ul>
      <li>Kala mala</li>
      <li>Hauki dauki</li>
     </ul>
  </li>
  <li>Simsalabim
    <ul>
      <li>Dudel didel</li>
      <li>Dudel döh</li>
      <li>Labedi bap</li>
    </ul>
  </li>
</ul>

JRuby on Rails 3.2

I currently have to work on an application using JRuby on Rails 3.2. My background is 12+ years of Java centric web development using Eclipse or IntelliJ.

There are a few things that I love about working with Java in Eclipse or IntelliJ that I miss when working with Rails:

  • Java’s backwards compatibility
  • Java’s cross-platform consistency
  • That Java has a static type system and is a compiled language
  • The relatively rigid syntax of Java that prevents idiosyncratic DSLs
  • Being able to control mutability, extensibility and visibility at compile-time (private, final)
  • Java’s distinction of interfaces vs implementation classes
  • Powerful auto-completion and Refactoring in the IDE
  • Powerful code inspections and quickfixes in the IDE
  • IDE and compiler feedback about mistakes and design flaws in my code
  • The powerful and rich ORM features of JPA and Hibernate

Dynamic language fans might cringe at some of the points listed above. Feel free to provide constructive feedback or well-reasoned criticism.

There are however a couple of things that I like about Ruby on Rails 3.2:

  • Dependency management using gems and bundler
  • A very standardized project layout (directory structure and conventions)
  • Code generation (as a convenient way to quickly create sample code)
  • Out-of the box integration and support for JQuery, CoffeeScript, SASS
  • Cool gems like colorbox-rails for turning a regular view into a modal dialog
  • The asset pipeline

I am still in the early phase of my Rails experience and I will try to post more about it as things evolve.