[AYUDA] Por favor ayuda con imagenes en html

[gramsch]

Hola! Estoy desarrollando una pagina web para una empresa familiar, y quiero que sea compatible para teléfonos.
Lo que sucede, es que tenemos un header con un logo y el nombre de la compañía, los cuales van uno a cada lado, pero lo que quiero, es que cuando se achique la ventana, la imagen también se achique, pero se queda ahí y desde cierto tamaño, hace que el texto se mueva hacia abajo de la pagina desconfigurando todo.

Como puedo hacer que la imagen se vaya achicando de acuerdo se va achicando la ventana?
Lo mismo pasa cuando ingreso desde el celular, la imagen del tamaño hace que el nombre quede abajo,  ya intente asignando tamaño con forma de porcentaje, pero no funciona.

[Pantera80]

Buenas, prueba con esto:

Código [Seleccionar] Expandir


.imagen {
     max-width: 100%;
     height: auto;
}


Así el ancho de la imagen se adaptará a su contenedor

[gramsch]

Te refieres a hacer un contenedor <div> con la clase imagen, o simplemente agregarla a la imagen??

[Pantera80]

Sería meter a la imagen en un div

Código [Seleccionar] Expandir


<div>
      <img>
</div>



La imagen cogerá el tamaño del div. Tú debes ajustar el div al tamaño que quieras, y la imagen hará lo mismo. En el div es donde debes poner el width en porcentaje, a la imagen no se lo pongas.

Lo del max-width:100% es por si el div se hace demasiado grande, para que la imagen no se pixele