CSS - Responsive - cuando el tamaño de la pantalla sea un máximo de 400px la imagen desaparezca

 
Vista:
Imágen de perfil de Juan Camilo
Val: 4
Ha disminuido 1 puesto en CSS (en relación al último mes)
Gráfica de CSS

Responsive - cuando el tamaño de la pantalla sea un máximo de 400px la imagen desaparezca

Publicado por Juan Camilo (2 intervenciones) el 20/09/2016 01:16:02
Buenas tardes a todos
Acudo a uds para que me ayuden con esta duda que tengo:

Resulta que tengo el siguiente código en mi html
1
2
3
4
5
<div id="encabezado">
    <img id="logo2" src="imagenes/ppal/grupo.png"/>
    <div></div>
    <center><img id="logo" src="imagenes/ppal/bibliosis.png"/></center>
</div>

Resulta que estoy haciendo mi pagina responsive y quiero que cuando el tamaño de la pantalla sea un máximo de 400px la imagen identificado como logo2 desaparezca pero no me funciona:
1
2
3
@media screen and(max-width:400px){
    #logo2{display: none}
}

Quisiera que por favor me orienten porque cuando hago lo mismo en una clase, si funciona.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 657
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Responsive - cuando el tamaño de la pantalla sea un máximo de 400px la imagen desaparezca

Publicado por xve (489 intervenciones) el 20/09/2016 12:44:52
Hola Juan Camilo, el problema que tienes, es que te falta un espacio...

Tienes esto:
1
@media screen and(max-width:400px){
y tiene que ser esto:
1
@media screen and (max-width:400px){

He hecho esta prueba para comprobarlo:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
 
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<style>
	@media screen and (max-width:400px){
	    #logo2{display: none;}
	}
	</style>
</head>
<body>
 
<div id="encabezado">
    <img id="logo2" src="imagenes/ppal/grupo.png"/>
    <div></div>
    <center><img id="logo" src="imagenes/ppal/bibliosis.png"/></center>
</div>
 
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Juan Camilo
Val: 4
Ha disminuido 1 puesto en CSS (en relación al último mes)
Gráfica de CSS

Responsive - cuando el tamaño de la pantalla sea un máximo de 400px la imagen desaparezca

Publicado por Juan Camilo (2 intervenciones) el 20/09/2016 12:59:03
XVE nuevamente muchas gracias...me funcionó a la perfección.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar