Jump to content

Recommended Posts

Buenos días,
 
Tengo un problema con el despliegue de las opciones del módulo blockuserinfo en móbiles.
 
En el pc se ve todo normal:
post-1146232-0-48526600-1452339417_thumb.png
 
Cuando abro la página en el móbil y pincho las opciones la lista de despliega fuera de la pantalla:
post-1146232-0-74204900-1452339390_thumb.png
 
post-1146232-0-92236900-1452339394_thumb.png
 
Entiendo que tiene que ser una propiedad que falta en el CSS para limitarlo pero no sé lo que es. El código que se genera es este:
 

<div class="header_user_info popup-over e-translate-top">

                    <div data-toggle="dropdown" class="popup-title"><a href="#"><i class="fa fa-gear"></i> <span>Ajuste</span></a></div>

                    <ul class="links">

                                         <li><a class="login" href="http://www.xxxxxx.es/mi-cuenta" rel="nofollow" title="Ingrese a su cuenta de cliente">

                                                                                <i class="fa fa-edit"></i>Registrarse

                                                            </a></li>

                                       

                                        <li>

                                                            <a href="http://www.xxxxx.es/mi-cuenta" title="Mi cuenta"><i class="fa fa-user"></i>Mi Cuenta</a>

                                        </li>

                                        <li class="last">

                                                            <a href="http://www.xxxxxx.es/pedido" title="Revisa" class="last"><i class="fa fa-repeat"></i>Revisa</a>

                                        </li>

                                        <li class="first">

                                                            <a id="wishlist-total" href="http://www.xxxxxx.es/module/blockwishlist/mywishlist" title="Mis listas de regalo">

                                                            <i class="fa fa-heart"></i>Lista de deseos</a>

                                        </li>

                                        <li>

                                                            <a href="http://www.xxxxx.es/comparativa-productos" title="Comparar" rel="nofollow">

                                                            <i class="fa fa-refresh"></i>Comparar

                                                            </a>

                                        </li>

                    </ul>

</div>

 

y el CSS que aplica al links es el que sigue:

 

#topbar {
  min-height: 50px;
  font-size: 14px;
  background: white;
  border-bottom: 1px solid #eaeaea;
}
#topbar .container {
  background: white;
  color: #666666;
}
#topbar .links {
  padding: 13px 0 12px;
}
#topbar .links li {
  border-right: #eaeaea;
  border-style: none solid none none;
  border-width: 0 1px 0 0;
}
.rtl #topbar .links li {
  border-left: #eaeaea;
  border-right: inherit;
}
.rtl #topbar .links li {
  border-style: none none none solid;
}
.rtl #topbar .links li {
  border-width: 0 0 0 1px;
 
Agradecería si alguien me pudiese orientar en el problema.
 
Saludos
Edited by [email protected] (see edit history)
Link to comment
Share on other sites

  • nadie locked this topic
Guest
This topic is now closed to further replies.
×
×
  • Create New...