Drupal 7: Styling language switcher

Language switcher is a Drupal module which allows to display a block that allows visitors to choose between the languages in which your site is available (check /admin/config/regional/language to list the available languages in your Drupal site).

By default, it produces an unordered list with each item in a new line and a bullet before each item. Not a big fan of this look.

With the following CSS code you’ll have an inline language switcher, with li items separed by “/”.

/* language switcher */
ul.language-switcher-locale-url{
list-style: none;
display: inline;
}
 
ul.language-switcher-locale-url li{
display: inline;
}
 
ul.language-switcher-locale-url li:after{
   content: "/";
}
 
ul.language-switcher-locale-url li:last-child:after{
   content: "";
}

For more advanced styling options, check this link.