36 - Posicionamiento relativo (position: relative)




Problema:

Disponer dos párrafos, desplazar el segundo párrafo hasta que quede casi superpuesto al primer párrafo.

<!DOCTYPE html>
<html>
<head>
<title>Problema</title>
<link rel="StyleSheet" href="estilos.css" type="text/css">
</head>
<body>
<p id="parrafo1">Primer párrafo.</p>
<p id="parrafo2">Segundo párrafo.</p>
</body>
</html>
#parrafo1,#parrafo2 {
  background-color:#ff0;
  width:300px;
  font-size:2em;
}

#parrafo2 {
  position:relative;
  top:-45px;
}
Ver solución


Retornar