divs en css

[laco84]

hola estoy diseñando mi sisito responsive, pero tengo dos divs y se me estan alineando los dos a la izquierda, cuando tengo definido en el css estilos.

se los pongo para ver si me puedean ayudar, uno debe de ir a la izquierda y rl otro a la derecha

#header {
background: #E1E1E1;
margin: 0px 0 1px;
padding: 0px 0px;
/* rounded corner */
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
/* box shadow */
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);
box-shadow: 0 1px 3px rgba(0,0,0,.4);



}
#headerizquierda {
width:auto;
height:auto;
background-color:#E1E1E1;
float: left;
clear:left

}
#headerderecha {
width:auto;
height:auto;
background-color:#E1E1E1;
float: right;

[NueveReinas]

width y height por defecto tienen el valor auto, así que no es necesario declararlo.
Y por cierto, te recomiendo utilizar clases para dar estilos.

A mí me funciona bien: http://jsfiddle.net/6bkr9fj7/

Quizá el problema esté en otros estilos...

[laco84]

ya lo solucione pero ahora el error es que el menu lo tengo de otro div y se baja a mitad de la pantalla

[NueveReinas]

Iniciado por laco84

ya lo solucione pero ahora el error es que el menu lo tengo de otro div y se baja a mitad de la pantalla

Te podríamos ayudar más si pegases el código utilizando el Highlight del foro.

[laco84]

este es mi codigo que tengo en el php en el lado drecho tengo una publicidad de google, el estilo css es el pegado arriba
,
<div id="pagewrap">

<div class=header>
<div class=headerizquierda>
<img src="http:/atabasco.com.mx/wp-content/uploads/2013/06/logo-2013-20141.gif"/>
</div>
<div class=headerderecha>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- arriba -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-4091178657021206"
data-ad-slot="1546354436"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
<nav>
<ul id="main-nav" class="clearfix">
<li><a href="http://webdesignerwall.com">Home</a></li>
<li><a href="http://themify.me">Themify</a></li>
<li><a href="http://icondock.com">IconDock</a> </li>
<li><a href="http://ndesign-studio.com">N.Design</a></li>
</ul>
<!-- /#main-nav -->
</nav>

[NueveReinas]

Creo que tienes mucha ansiedad por hacer esto y no estás mirando bien las cosas.
Por ejemplo, ni utilizas el Highlight como claramente te he dicho, ni pones las comillas en las clases de los div.

No se bien cómo funciona eso de la publicidad de Google, porque ningún editor de código online me muestra el resultado (ni JSFIDDLE ni CODEPEN). Pero imagino que algún error debe haber.

[laco84]

jejejeej ya todo el dia lo he estado haciendo, no se mucho pero ya me desespero

[mbm150]

Hola,

bueno, no se si he entendido del todo el problema. La publicidad de google no se ve si tienes adblock activado (evidentemente) o si se carga mediante ajax , tiene que cargarse con la pagina para funcionar.

Mirando el codigo que has puesto, hay bastantes fallos, no se si lo has copiado mal o lo has hecho asi en la web, has puesto class donde debe ir id (o alreves) y faltan comillas.

Este es el codigo correcto:

Código HTML:

<div id="header">
        <div id="headerizquierda">
            <img src="http://atabasco.com.mx/wp-content/uploads/2013/06/logo-2013-20141.gif"/>
        </div>
        <div id="headerderecha">
            <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
            <!-- arriba -->
            <ins class="adsbygoogle"
                style="display:inline-block;width:728px;height:90px"
                data-ad-client="ca-pub-4091178657021206"
                data-ad-slot="1546354436"></ins>
                <script>
                (adsbygoogle = window.adsbygoogle || []).push({});
                </script>
        </div>
    </div>
    <nav>
        <ul id="main-nav" class="clearfix">
            <li><a href="http://webdesignerwall.com">Home</a></li>
            <li><a href="http://themify.me">Themify</a></li>
            <li><a href="http://icondock.com">IconDock</a> </li>
            <li><a href="http://ndesign-studio.com">N.Design</a></li>
        </ul>
    </nav>
 

Y este el css:

Código CSS:

#header {
    background: #E1E1E1;
    margin: 0;
    padding: 0;
    /* rounded corner */
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    /* box shadow */
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);
    box-shadow: 0 1px 3px rgba(0,0,0,.4);
    overflow: hidden;
}
#headerizquierda {
    background-color:#E1E1E1;
    float: left;
}
#headerderecha {
    background-color:#E1E1E1;
    float: right;
}
 

Como veras he añadido al #header overflow: hidden; para que se vea el color de fondo y eso.

Yo lo veo todo bien a falta del estilo del menu claro.

Saludos.

[pzin]

Iniciado por NueveReinas

ni pones las comillas en las clases de los div.

En HTML5 las comillas en el valor de los atributos son opcionales.

[NueveReinas]

Iniciado por mbm150

has puesto class donde debe ir id (o alreves)

Creo que lo hizo así porque yo le pasé un ejemplo donde usaba clases en lugar de IDs.

[laco84]

gracias a todos la verdad me ha costado lo he logrado resolver, pero ahora estoy luchando con un margen que me salio arriba de la pagina.

hasta donde he leido es un margin-top pero en los estilos no lo tengo definido, lo habia declarado en el body pero no me hace caso.

esta es la pagina en funcion que estoy haciendo, en ella estoy rediseñando mi sitio,
el sitio donde estoy rediseñando el diseño para que sea responsivo de ahi ya lo migrare la plantilla a mi otro dominio http://tabascoa.com

este es mi dominio para el cual estoy rediseñando todo, ahi va aunque si me ha costado bastante, he leido manuales, he visto bastantes videos, pero ahi la llevamos.
http://atabasco.com.mx

espero lo visiten y me den su opinion, no esta igual, ya que si me ha costado mucho

saludos