Alinear 3 div en diferentes resoluciones

[manelmanel8]

Buenas,

tengo 3 div alineados uno al lado del otro, en resolución 1920x1024 todo correcto pero cuando hago la ventana más pequeña se empiezan a mover los div y me gustaria que se fueran adaptando...

Por lo menos hasta una resolución 800x600

Gracias

Código HTML:

#button-menu {
	float:left;
  	line-height:6.9;
  	width:auto;
  	cursor:pointer;
    display: block-inline;
	margin-left:4.5rem;	
}

#button-imgmenu {
	vertical-align: middle;
	margin-right: 0.75rem;
    display: block-inline	
}

#button-iniciar {
	float:right;
  	line-height:6.9;
  	width:auto;
  	cursor:pointer;
    display: block-inline;
	position: relative;	
	margin-right: 4.5rem;
}

#logo {
    float:left;
    background: url(../images/logo.png) no-repeat 0 0;
    display: block-inline;
    width: 80%;
    height: 2.688rem;
    text-indent: -9999px;
	position: relative;
	margin-top: 2.2rem;	
	background-position: center;
}

Parte html

Código HTML:

 <header>
        <div id="button-menu">
        	<p><img id="button-imgmenu" src="images/menu.jpg" width="30px" height="30px"/>MENU</p>
        </div>  
		<a href="index.php" id="logo" alt="Logo" title="Logo">Logo</a>    
        <div id="button-iniciar">
        	<p><a href="#">INICIAR SESIÓN</a></p>
        </div>                
    </header> 

[alzacon]

No sé si quieres contar header como div o no, porque contiene a los otros dos elementos divisores, porque sólo cuento dos elementos div (como tal). Y en el css cuatro id: dos a los divs, otro a la imagen (img) y otro al enlace (a) "Logo".

[manelmanel8]

Esta el header que engloba los 3 div dentro, button-menu, logo, button-iniciar

Yo cuento esos 3...

[alzacon]

Creo que tienes un cacao (lio) importante.

https://developer.mozilla.org/es/doc...L/Elemento/div

Aunque el codigo de ejemplo no se muestra bien del todo, tendría que ser la mezcla entre esto (resaltando el elemento en cuestión en sus etiquetas).

<div style="color: blue;">
....
</div>

y el resaltado de código html:

Código HTML:

<div style="color: blue;">
  <h2> Ejemplo de div y span </h2>
  <p>
    Esto es un párrafo dentro de un div,
    <span style="color: red;"> y esto un span dentro de un párrafo.</span>
  </p>
</div> 

Eso que cuentas son los atributos identificador (id), por ejemplo tú tienes una imagen que tiene id. Los div que tienes son los correspondientes id boton-menu y boton-iniciar.

Te recomiendo que pruebes hacer lo que intentas con tres elementos div vacios con las propiedades que usas para colocarlos, altura, anchura y, ademas para diferenciarlos, color de fondo.