Problemilla con 2 elementos web

YolandaGC · #1 (**permalink**) 26/03/2013, 04:34

Hola! Estoy teniendo problemas para colocar a la misma altura y a la derecha 2 elementos web. La url es http://negre.es/tienda/
los elementos que me dan problemas son el selector de idiomas y el selector de tienda/studio.
Cuando activo el selector de idiomas, el ancho del web se descoloca y el selector de tienda/studio no se mantiene a la derecha.

¿Cuál es el problema?

Código html:

Código:

<body <?php echo $bodyclass; ?>>

    <div id="frame">
    
   
        <div id="container">
        <div class="idiomas"><jdoc:include type="modules" name="languages"   /></div> 
            <div class="pad_container">
            
            
            
           
                <div id="top">
               
                
                    <div id="top-left">
                        <?php
                        $ts_logotype = $this->params->get('ts_logo_type');
                        $ts_sitename = $this->params->get('ts_site_name');
                        $ts_tagline = $this->params->get('ts_tagline');
                        $ts_searchposition = $this->params->get('ts_search_position');

                        if ($ts_logo == "") {
                            $ts_logo = $ts_path . "/images/logo.png";
                        }
                        $ts_sitename = ($templateparams->get('ts_site_name')) ? $templateparams->get('ts_site_name') : $jConfig->sitename;
                        ?>
                        <?php if ($ts_logotype == 'textlogo') { ?>
                            <div id="logo">
                                <h1><a href="<?php echo $this->baseurl; ?>/"><?php echo $ts_sitename; ?></a></h1>
                                <?php if ($ts_tagline != "") { ?><span class="desc"><?php echo $ts_tagline; ?></span><?php } ?>
                            </div><!-- end #logo -->
                        <?php } else { ?>
                      <div id="logoimg" style="margin-top: 18px;">
                                <a href="<?php echo $this->baseurl; ?>/"><img width="277" src="<?php echo $ts_logo ?>" alt="" /></a>
                            </div>
                        <?php } ?>
                       
                    </div><!-- end #top-left -->

                   
 
 <div id="selector"><span class="current">TIENDA</span> | <span><a href="../studio">STUDIO</a></span>
                    </div>
                </div><!-- end #top -->
                
                <!--<div style="clear:both"></div>-->
                <div id="top-navigation">
                
                    <?php if ($this->countModules('navigation')) { ?>
                        <jdoc:include type="modules" name="navigation" />
                    <?php } ?>
                </div><!-- end #top-navigation -->

Código css:

Código:

#selector { float:right;margin-top:30px;}

Código:

.idiomas{
float:right;
margin:0;
padding:0;}

temerariomalaga · #2 (**permalink**) 26/03/2013, 05:00

Buenas, intenta usar un margin-bottom negativo para bajar los idiomas. Pruebalo y di que tal.

pzin · #3 (**permalink**) 26/03/2013, 05:08

Deberías de empezar por meter el selector de idiomas en el mismo elemento donde tienes el div#selector, es decir, dentro de div#top.

Lo del margen negativo es un mal apaño.

YolandaGC · #4 (**permalink**) 26/03/2013, 08:14

Ya he metido idiomas dentro de div#top, aunque tienda/studio se mueve hacia la izquierda y no tiene porqué:

#selector{ color: #303030 !important;}

#selector { float:right;margin-top:30px;}

#selector span { display:inline; margin:0px;font-size:13px; }

y los idiomas siguen haciendo un margen o padding raro, fijáos cuando actualizamos el web, parece que quiera irse a la derecha.

Cualquier ayuda es bienvenida...

pzin · #5 (**permalink**) 26/03/2013, 08:28

¿Quieres alinear el selector de idiomas o mantener tienda/studio a la derecha? No sé porqué yo entendí lo primero.

Y caso de que sea eso, ¿dónde quieres poner lo del idioma?

YolandaGC · #6 (**permalink**) 26/03/2013, 11:10

Cita:

Iniciado por Bonez

¿Quieres alinear el selector de idiomas o mantener tienda/studio a la derecha? No sé porqué yo entendí lo primero.

Y caso de que sea eso, ¿dónde quieres poner lo del idioma?

serían los 2 a la derecha uno debajo de otro.

tataNZ · #7 (**permalink**) 26/03/2013, 11:31

Empieza por agregar "clear:right" a tu selector.

Como te han comentado, yo también me fijaría en reorganizar los elementos.

#selector {
clear:right;
float:right;
line-height:80%;
margin-top:30px;
}

pzin · #8 (**permalink**) 26/03/2013, 11:31

Cita:

Iniciado por YolandaGC

serían los 2 a la derecha uno debajo de otro.

Entonces sólo tienes que cambiar el HTML y poner div.idiomas como primer hijo de div#selector.

YolandaGC · #9 (**permalink**) 26/03/2013, 12:02

Primero ha de verse idiomas y abajo selector.
Clear:right; eliminó el espacio que hacía el selector a la derecha.¡Gracias!

Si os fijáis, al actualizar el web, parece que el web vaya a la derecha y vuelva a su sitio.
¿qué significa esto? Cuando he quitado idiomas, no ocurre.

He mirado los padding y margin y no hay ninguno.

Código css actual:

tienda/studio

Código:

#selector { clear:right;float:right;margin-top:27px;line-height:80%;}

Código:

width:100px;	
margin-top:-10px;
float:right;
}

pzin · #10 (**permalink**) 26/03/2013, 12:11

¿En qué navegador te ocurre eso? A mi ni en Chrome ni en Safari me pasa eso.

Edito: En Firefox si que ocurre. Supongo que tendrá que ver con esto:

Código CSS:

Ver originalmin-height: 100%;

En el elemento body. No parece que necesites tener una altura mínima, así que yo lo quitaría.

YolandaGC · #11 (**permalink**) 26/03/2013, 12:27

Cita:

Iniciado por Bonez

¿En qué navegador te ocurre eso? A mi ni en Chrome ni en Safari me pasa eso.

Edito: En Firefox si que ocurre. Supongo que tendrá que ver con esto:

Código CSS:

Ver originalmin-height: 100%;

En el elemento body. No parece que necesites tener una altura mínima, así que yo lo quitaría.

Parece ser que ese min-height:100%; no está pues su css es

Código:

body {
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:11px;
  margin:0 auto;
  padding:0;
  color:#666666;
  line-height:20px;
  background-repeat:repeat;
  background-position:top;
  background-attachment:fixed;
}

ni idea donde está ese min-height:100% en body!

pzin · #12 (**permalink**) 26/03/2013, 12:39

Lo tienes embebido en el HTML.

YolandaGC · #13 (**permalink**) 26/03/2013, 13:02

Cita:

Iniciado por Bonez

Lo tienes embebido en el HTML.

pero no encuentro la clase para modificarlo.No sé de donde lo coge.

¿Es posible que en chrome se vea el selector de idiomas no justificado a la derecha?
en firefox lo veo bien, pero en chrome no...

pzin · #14 (**permalink**) 26/03/2013, 13:13

Cita:

Iniciado por YolandaGC

pero no encuentro la clase para modificarlo.No sé de donde lo coge.

¿Qué te sugiere embebido en el html?

YolandaGC · #15 (**permalink**) 26/03/2013, 15:04

Cita:

Iniciado por Bonez

¿Qué te sugiere embebido en el html?

Que está marcando estilo en el html? pero he mirado y no lo veo... debería estar en header.php

pzin · #16 (**permalink**) 26/03/2013, 15:35

Si usas Wordpress, Joomla o alguna otra cosa similar pregunta mejor en el foro de Aplicaciones Enlatadas.

emprear · #17 (**permalink**) 26/03/2013, 16:21

Se arregló? @bonez? yo tampoco encuentro ese min-height, de todas formas

id duplicados + jquery + mootools + cufon !!!! + etiquetas mal cerradas, yo no empezaría por corregir el css sin revisar al menos el html

SAludos

pzin · #18 (**permalink**) 26/03/2013, 16:49

Cita:

Iniciado por emprear

Se arregló? @bonez? yo tampoco encuentro ese min-height, de todas formas

Yo ahora ya no lo veo tampoco. Supongo que lo habrá quitado.

YolandaGC · #19 (**permalink**) 27/03/2013, 03:10

Es que todo el problema me lo daba el módulo idiomas, aunque no tiene estilos embebidos.
No es un problema del site, sino de los idiomas. Seguiré mirando y probando opciones.
¡Buenos días!

Un saludo,
Yolanda.