Return to previous page

Css bug when hovering over cart Icon in Translated site RTL

This topic has 4 replies, 2 voices, and was last updated 8 years, 8 months ago ago by Jack Richardson

mabellek

Participant

March 13, 2016 at 23:41

hi

In the hebrew version of the website if you hover on the search Icon in Nav Menu the whole website jumps to the right out of the screen. its some combinataion of hover and scroll

Please assist.

with css code that will not interfere or conflict RTL Direction.

Eva and Jack have credentials

Thanks

#117200 Copied Theme version: 2.8 WooCommerce version: 2.52

3 Answers
Jack Richardson

Support staff

March 14, 2016 at 10:08
Hello,

Try to use this code in Custom CSS for desktop section:
```
.rtl .et-search-trigger form {
    position: fixed !important;
    top: 62px !important;
    right: 65%;
}
```
Best regards,
Jack Richardson.
#117250 Copied
mabellek

Participant

March 14, 2016 at 13:20

Hi Jack

Thanks for the quick response.

I inserted the the code you gave above beginning with “.rtl” into the desktop custom css section . It did nor work.

I then removed it from there and put it into the rtl.css file without the “.rtl” at the beginning this worked properly
thanks.

So it is only applied via the rtl.css file. If i want to apply it to certain screen widths what would i need to add before this code within the rtl.css file ?

.et-search-trigger form {
position: fixed !important;
top: 62px !important;
right: 65%!important;
}

thanks

#117316 Copied
Jack Richardson

Support staff

March 14, 2016 at 14:06
Hello,

For example, for desktop view, you need use this code:
```
@media (min-width: 1200px) {.et-search-trigger form {
    position: fixed !important;
    top: 62px !important;
    right: 65%;
}}
```
Best regards,
Jack Richardson.
#117321 Copied
Tagged: cart, hover, icon, themes, translated, woocommerce, wordpress
Viewing 4 results - 1 through 4 (of 4 total)