Ver Mensaje Individual
  #4 (permalink)  
Antiguo 13/03/2015, 06:29
Avatar de GemliosG
GemliosG
 
Fecha de Ingreso: enero-2015
Ubicación: La Habana
Mensajes: 153
Antigüedad: 9 años, 10 meses
Puntos: 8
Respuesta: Contenido central invisible

El código es este: (el que modifique)

HTML

Código HTML:
 <div id="contenedor">
    	<div style="position: fixed; width: 100%;">
    	<header>
	    	<titulo>Logo aquí</titulo>
            <nav>
            	<ul>
                    <li><a href="#" class="active">Inicio</a></li>
                    <li><a href="#">Seccion</a></li>
                    <li><a href="#">Seccion</a></li>
                    <li><a href="#">Seccion</a></li>
                </ul>
            </nav>
        </header>
        </div>
        <contenido>
        	<div id="central">
	            <h1>Welcome to my webpage</h1>
<h2>Contenido principal y centra</h2>
            </div>
            <div id="columna">
            	<h1>Column</h1>
            <h2>Contenido de la columna</h2>
            </div>
        </contenido>
        <footer>
        	Todos los derechos reservados.
        </footer>
    </div> 
CSS
Código:
@charset "utf-8";

html, body { margin: 0; padding: 0; }

#contenedor
{
	margin: 0 auto;
	background: #FFF;
	width: 100%;
}

	header
	{
		height: 100px;
		padding: 1% 1%;
		background-color: #22272A;
		margin: 0 auto;
	}
	
	/*header a { text-decoration: none; }*/	
		titulo
		{
			color: #FFF;
			margin: 0 auto;
			position: absolute;
			left: 20%;
			top: 2%;
			font-size: 48px;
			font-family: 'Oswald', sans-serif; 
		}
		
		nav
		{
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
		}			
		nav ul
		{
			width: 100%;
			max-width: 512px;
			margin: 0 auto;
		}		
		nav ul li
		{
			list-style: none;
			display: inline-block;
			float: left;
			padding: 10px;
			text-align: center;
		}
		nav ul li .active
		{
			color: #3479FA;
			background: #FFF; 
			border: 1px solid white;
			border-radius: 5px;
			border-bottom-right-radius: 0;
			border-bottom-left-radius: 0;
			padding: 10px;
		}
		nav ul li a
		{
			text-decoration: none;
			color: #FFF;
			width: 40px;
			font-weight: bold;
			font-family: 'Noto Sans', sans-serif;	
		}
		nav ul li a:hover { color: #3479FA; }
		
	contenido
	{
	  padding-top:120px;
		margin: 0 auto;
		width: 61%;
		height: 30%;
		display: table;
		overflow: scroll;
		text-align: justify;
		font-family: 'Noto Sans', sans-serif;
	}	
	contenido div
	{
		display: table-cell;
		vertical-align: top;
		padding:20px;
	}	
	contenido div:first-child
	{
		border-right: 1px dashed #999999;	
	}	
	#central { width: 80%; }	
	#columna { width: 20%; }
	
	footer
	{
		bottom: 0;
		width: 100%;
		font-family: 'Noto Sans', sans-serif;
		background: #22272A;
		color: #FFF;
		text-align: center;
		padding: 10px;
	}
__________________
GemliosG