Title: CSS problem Last modified: August 30, 2016 --- # CSS problem * Resolved [petiteprof79](https://wordpress.org/support/users/petiteprof79/) * (@petiteprof79) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/) * Hi, when I used mqtranslate I had figured out the CSS code * .qts-lang-menu { list-style-type:none; float:right; } * ul.qtrans_language_chooser > .active { display:none; } * .qtrans_language_chooser li { float:inline; margin-right:3px } * .qtrans_flag{ width: 67px !important; height: 50px !important; background-size: 67px 50px !important; } * in order to dispay the non-active flags in my header in [http://www.steffi-woessner.de](http://www.steffi-woessner.de) on the left side, in one line only and I had replaced the icons for the languages and made them bigger. * I tried to change the code in qtranslate x to * .qtrans_language_chooser { list-style-type:none; float:right; } * ul.qtranxs_language_chooser > .active { display:none; } * .qtrans_language_chooser li { float:inline; margin-right:3px } * .qtranxs_flag{ width: 67px !important; height: 50px !important; background-size: 67px 50px !important; } * however, I only got rid of the active flag. I understand that I need to replace the flag icons. That’s not the problem. However, the default flags are still shown one above the other and small in the middle. * Can anyone tell me what I need to change? Help would be much appreciated. Thanks! * [https://wordpress.org/plugins/qtranslate-x/](https://wordpress.org/plugins/qtranslate-x/) Viewing 10 replies - 1 through 10 (of 10 total) * Plugin Author [Gunu](https://wordpress.org/support/users/grafcom/) * (@grafcom) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535604) * [@petiteprof79](https://wordpress.org/support/users/petiteprof79/) * try this consistent: * > If CSS of your theme or some plugins was previously customized for one of the > earlier qTranslate forks, you may need to rename prefixes ‘qtrans_’ to ‘qtranxs_’ > in the CSS files, or make other meaningful adjustments. * Thread Starter [petiteprof79](https://wordpress.org/support/users/petiteprof79/) * (@petiteprof79) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535608) * Hi Gunu, thanks for the quick reply. I checked. I do have the option of adding custom CSS to my theme just like with the plugin. Which is why I didn’t interfere with any CSS customization apart from that if I recall correctly. * I did change the code to * .qtranxs_language_chooser { list-style-type:none; float:left; } * ul.qtranxs_language_chooser > .active { display:none; } * .qtranxs_language_chooser li { float:inline; margin-left:5px } * .qtranxs_flag { width: 67px !important; height: 50px !important; background- size: 67px 50px !important; } * and deleted the CSS from my theme options * which did put the flags on the left margin of my header. Their size hasn’t changed though, neither has the fact that they are not in line. * Thread Starter [petiteprof79](https://wordpress.org/support/users/petiteprof79/) * (@petiteprof79) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535620) * Could it have something to do with the setting for css class (ul) for the language switcher with is set to qtranxs-lang-switch-wrap? * Plugin Author [Gunu](https://wordpress.org/support/users/grafcom/) * (@grafcom) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535624) * [@petiteprof79](https://wordpress.org/support/users/petiteprof79/) check this in your CSS `img.scale-with-grid, img` This should adjust your view = overwrite? * Thread Starter [petiteprof79](https://wordpress.org/support/users/petiteprof79/) * (@petiteprof79) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535637) * Couldn’t find. However: I am one step closer. I added a widget to my theme and then it gave me this to change CSS of the widget: * .qtranxs_widget ul { margin: 0; } .qtranxs_widget ul li { display: inline; /* horizontal list, use “list-item” or other appropriate value for vertical list*/ list-style-type: none; /* use “initial” or other to enable bullets */ margin: 0 5px 0 0; /* adjust spacing between items */ opacity: 0.5; -o-transition: 1s ease opacity; -moz-transition: 1s ease opacity; -webkit-transition: 1s ease opacity; transition: 1s ease opacity; } /* .qtranxs_widget ul li span { margin: 0 5px 0 0; } */ /* other way to control spacing */ .qtranxs_widget ul li.active { opacity: 0.8; } .qtranxs_widget ul li:hover { opacity: 1; } .qtranxs_widget img { box- shadow: none; vertical-align: middle; } .qtranxs_flag { height:12px; width:18px; display:block; } .qtranxs_flag_and_text { padding-left:20px; } .qtranxs_flag span { display:none; } * So I picked what I thought I needed. Now the CSS code looks like this: * .qtranxs_language_chooser { list-style-type:none; float:left; } * ul.qtranxs_language_chooser > .active { display:none; } * .qtranxs_language_chooser li { display:inline; margin-left:5px } * .qtranxs_flag { height:50px; width:67px; display:block; } * and the only thing that is still not working is the image size. I wonder what will happen if I simply exchange the images of the icons and use bigger ones... * Plugin Author [Gunu](https://wordpress.org/support/users/grafcom/) * (@grafcom) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535644) * > I wonder what will happen if I simply exchange the images of the icons and > use bigger ones. .. * Yes, this works. * Thread Starter [petiteprof79](https://wordpress.org/support/users/petiteprof79/) * (@petiteprof79) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535652) * So will do 🙂 Will they still be responsive in a responsive theme? Thanks for the help. * Plugin Author [Gunu](https://wordpress.org/support/users/grafcom/) * (@grafcom) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535670) * if you not specify fixed sizes… then it will work * Thread Starter [petiteprof79](https://wordpress.org/support/users/petiteprof79/) * (@petiteprof79) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535672) * perfect. thank you so much! * Plugin Author [Gunu](https://wordpress.org/support/users/grafcom/) * (@grafcom) * [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535679) * [@petiteprof79](https://wordpress.org/support/users/petiteprof79/) * You are welcome! * You can [review this plugin](https://wordpress.org/support/view/plugin-reviews/qtranslate-x) to help other people to find out the value. Viewing 10 replies - 1 through 10 (of 10 total) The topic ‘CSS problem’ is closed to new replies. * ![](https://s.w.org/plugins/geopattern-icon/qtranslate-x_f9f9f9.svg) * [qTranslate X](https://wordpress.org/plugins/qtranslate-x/) * [Frequently Asked Questions](https://wordpress.org/plugins/qtranslate-x/#faq) * [Support Threads](https://wordpress.org/support/plugin/qtranslate-x/) * [Active Topics](https://wordpress.org/support/plugin/qtranslate-x/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/qtranslate-x/unresolved/) * [Reviews](https://wordpress.org/support/plugin/qtranslate-x/reviews/) * 10 replies * 2 participants * Last reply from: [Gunu](https://wordpress.org/support/users/grafcom/) * Last activity: [10 years, 8 months ago](https://wordpress.org/support/topic/css-problem-48/#post-6535679) * Status: resolved