Tema: CSS y HTML se muestran así. ¿Cómo arreglarlo?
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 01/09/2015, 15:34
diegoguerrero
 
Fecha de Ingreso: diciembre-2014
Ubicación: Madrid
Mensajes: 274
Antigüedad: 9 años, 11 meses
Puntos: 5
CSS y HTML se muestran así. ¿Cómo arreglarlo?
Código CSS: 
Ver original
  1. @charset "UTF-8";
  2. /*GENERALES*/
  3. a{
  4.     text-decoration:none;
  5. }
  6. #h3{
  7.     text-align: center;
  8.     width: 100%;
  9.     color: #D8E52C;
  10.     height: 45px;
  11.     line-height: 45px;
  12.     vertical-align: middle;
  13.     font-size:30px;
  14.     font-family:"HelveticaNeue-Fina";
  15. }
  16. #pCuerpo{
  17.    color: #000;
  18.    font-size:18px;
  19.    font-family:"HelveticaNeue-Fina";
  20. }
  21. @media (min-width: 450px){
  22.     #izquierda{
  23.         border: 1px solid black;
  24.         text-align: center;
  25.         align-content: center;
  26.         width: 49%;
  27.         margin: 0px;
  28.     }
  29.      #derecha{
  30.         border: 1px solid black;
  31.         text-align: center;
  32.         align-content: center;
  33.         width: 49%;
  34.         margin: 0px 0px 0px 50%;
  35.     }
  36. }
  37. /*LENGUA-CASTELLANA-Y-LITERATURA*/
  38.     #len-div-h1{
  39.         color: #FFFFFF;
  40.         background-color: #2491C9;
  41.         font-size: 45px;
  42.         font-family: "HelveticaNeue-Fina";
  43.         text-align: center;
  44.         vertical-align: middle;
  45.         line-height: 75px;
  46.         height: 75px;
  47.         width: 100%;
  48.     }
  49.     #len-div-h2{
  50.         color: #FFFFFF;
  51.         background-color: #2491C9;
  52.         font-size: 23px;
  53.         font-family: "HelveticaNeue-Fina";
  54.         text-align: center;
  55.         vertical-align: middle;
  56.         line-height: 45px;
  57.         height: 45px;
  58.         width: 100%;
  59.     }
Código HTML: 
Ver original
  1. <!doctype html>
  2. <head>
  3. <link href="css.css" type="text/css" rel="stylesheet">
  4. <meta charset="UTF-8">
  5. <title>Síntesis 4º ESO</title>
  6. </head>
  7. <body>
  8. <div id="cuerpecito">
  9. <div id="izquierda">
  10.     <div id="h3">Materias comunes</div>
  11.     <div id="len-div-h2">Lengua</div>
  12. </div>
  13. <div id="derecha">
  14.     <div id="h3">Materias comunes</div>
  15.     <div id="len-div-h2">Lengua</div>
  16. </div>
  17. </div>
  18. </body>
  19. </html>
IMAGEN:

¿Cómo puedo hacer que las dos columnas queden a la misma altura? Muchas gracias. Una preguntita más: Lo estoy haciendo para ordenador. ¿Cómo lo podría hacer para el móvil? Muchas gracias.