I'm sure this is a simple fix but I need help removing the bullets in the Language Switcher block (i18n Module). I have the problem in multiple templates. Currently I'm using A3 Atlantis. Can someone tell me how to style this block in order to remove the bullets? It should simply show flags before each language link but instead in displays a bullet, the flag and then the language link on each line.

Comments

jenniferannwalsh’s picture

this worked for me:

#block-i18n-0 li
{
display: inline;
list-style-image: none;
}

. . . . . . .
jen

meruthecat’s picture

jahwah,

Thanks for the post but this didn't work for me. Am I correct in assuming this just goes into the theme style.css? I did clear the cache as well. I'm using Drupal 6 if that makes a difference.

Grum’s picture

#block-locale-0 li {
  display: inline;
  list-style-image: none;
}

Using Drupal 6.

meruthecat’s picture

I've looked through the various modules and can't find this piece of CSS. Do you have it in the Locale module or somewhere else?

Grum’s picture

I am using a theme (Newsflash) which allows the specification of a custom CSS file, and I've put the above code into that. In other words I've effectively modified the theme's CSS and not touched any modules.

AltoRetrato’s picture

That's a solution, but it might not work with themes that have just one basic class for a block.

For instance, I has this problem with the marinelli theme, where the "block.tpl.php" would always render any block as "defaultblock" class:

<div class="defaultblock">
    <h2><?php print $block->subject; ?></h2><!--block title-->
   <div class="blockcontent"><?php print $block->content; ?></div>
</div>

I changed the 1st line as below (adapted from the Garland theme):

<div id="block-<?php print $block->module .'-'. $block->delta; ?>" class="defaultblock clear-block block block-<?php print $block->module ?>">

After that, the Language Switcher block was rendered with id="block-locale-0" and class="defaultblock clear-block block block-locale"

JonMac’s picture

I'm also having a problem figuring out this problem. I really wish the module had more settings for modifying this widget.

I'm using Marinelli, and I tried doing what AltoRetrato instructed, but to no avail.

Since there were so many variants on this discussion page, I put all of this junk in my graphics.css file just to try to make it work, but it's still just an ugly bullet:

.block-locale-0 li {
list-style: none;
list-style-image: none;
list-style-type: none;
}
#block-i18n-0 li
{
display: inline;
list-style: none;
list-style-image: none;
list-style-type: none;
}
#block-locale-0 li {
  display: inline;
list-style: none;
list-style-image: none;
list-style-type: none;
}

Anyone else using Marinelli and has made this hack work?

castawaybcn’s picture

For the theme I am using I had to change:
list-style-image: none;
to
list-style-type:none;

giozzz’s picture

Hello, I've reading for the last 3 hours, and trying to add all snippets I found here and there but I just can't seems to get rid of the bullet next to the language in language switcher block... block-locale, block-i18n in style css don't work.
I ask for your help, if someone knows.... thanks

ecocity’s picture

Hi glozzz

It sounds like you have properly gained access to the style sheet managing the "block-locale-0"

To get rid of the bullets next to your language list,
you can style all of the unordered list derived bullets ( html that looks like this.. )

  • by adding a line in your style sheet that looks like so:

    .block-locale-0 li {
    list-style: none;
    }

giozzz’s picture

Hello ecocity, and thanks for your help!! I finally solved the matter, I just seemed not to be able to find the snipett listing the "il" property of the block, but after a lot of chasing I made it work! thanks again

Kelskels’s picture

What I did:

in the file Blocks.css

Add just after .block{margin-bottom:15px;}, the following lines:

.block li {
display: inline;
list-style-image: none;
}

yo-1’s picture

I spent a few hours applying all above solutions to my site, with no effect.

The solution for me was to switch my (recolorable, single-stylesheet Twilight-theme) back to default settings, and immediately the style changes became active!!! After that re-applied the original color settings of the theme, and bang!, my language-icons were bullet-free, and in-line!!!

Apparently this has to do with the behaviour of CSS and color module, in combination with recolorable themes....

Quote from the Twilight theme page:

Customizing style sheet
To change the style.css file, you need to change the color scheme back to the default one first. Then make any changes, test it, and reselect the color scheme of your preference. If you do not follow these steps, your change to the style.css would not be in effect. This is because of the mechanism of Drupal's color module.

Good luck,

Johan

DSL’s picture

Removing bullets on the language switcher only and putting the choices on the same line:

.block-locale li {
display: inline;
list-style: none;
}

Added to the theme's style.css

Hope it will help save some time to others (personnaly spent few hours on this).