Tag: browser

Drupal Multilingual Tips – Browser Settings, Session Params and Account Settings

I have a front/login page that is available to anonymous users. I need to be able to deliver the page bilingually but I rely primarily on the Drupal account settings and language switcher to determine whether the site is presented in English or Spanish. So how do I present in Spanish to anonymous users when appropriate? Drupal also allows you to use the user’s browser settings as well to determine what language to display. And it also allows you to change the order of factors to determine what language to present in. After some testing and a lot of thought about the UX, I have settled on,

  • Browser settings – Helps for Anonymous
  • Session parameter – If a Spanish defined account want to use the language switcher to get English instead for that session
  • Account settings – The catch-all
  • Default site language

In my specific case, this will provide the most flexibility for my audience.

Browser Hacks for CSS, IE10+, Safari 5 specifically

No one ever really wants to take shortcuts and wind up with spaghetti. But sometimes you have to. IE 10/11 are great browsers and are much more compliant with standards, but today I still had to use a hack to get something simple done. And thanks to http://www.browserhacks.com/ for showing me the way.

for IE 10/11 you use this:

_::-ms-reveal,

at the beginning of your selector. the selector will remain the exact same but it will only be interpreted by IE10+

so this is the original:

.sf-menu.sf-style-default a {/*092713 hack for IE10 and superfish super menu*/

font-size:104%;
}

and this is what you have afterwards to be interpreted only by IE.

_::-ms-reveal,.sf-menu.sf-style-default a {/*092713 hack for IE10 and superfish super menu*/
font-size:104%;
}

Note that the comment is mine and not needed. the only thing being changed is the font size. simple change but effective for a situation where I COULD NOT get the selector to work consistently despite all claims by MS.

This one works for Safari in that it doesn’t apply itself to Chrome, which would be the usual behavior.

@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari only override */
::i-block-chrome,.sf-menu.sf-style-default a {
padding-bottom: 10px;
padding-right: 23px;
font-size: 100%}
}

You can see that the only important part is where it blocks chrome. This should work with any selector