Estoy empezando a crear una web viendo diferentes ejemplos, pero no se ve muy bien que digamos. El ejemplo que vi se componía de parte central con dos partes laterales donde poner enlaces a otros sitios. ¿ Que estoy haciendo mal, queria utilizar bootstrap? Muestro el código que recogí del ejemplo de la comunidad.
body { min-width: 630px; } #container { padding-left: 200px; padding-right: 190px; } #container .column { position: relative; float: left; } #center { padding: 10px 20px; width: 100%; } #left { width: 180px; padding: 0 10px; right: 240px; margin-left: -100%; } #right { width: 130px; padding: 0 10px; margin-right: -100%; } #footer { clear: both; } /* IE hack */ * html #left { left: 150px; } /* Make the columns the same height as each other */ #container { overflow: hidden; } #container .column { padding-bottom: 1001em; margin-bottom: -1000em; } /* Fix for the footer */ * html body { overflow: hidden; } * html #footer-wrapper { float: left; position: relative; width: 100%; padding-bottom: 10010px; margin-bottom: -10000px; background: #fff; } /* Aesthetics */ body { margin: 0; padding: 0; font-family:Sans-serif; line-height: 1.5em; } p { color: #555; } nav ul { list-style-type: none; margin: 0; padding: 0; } nav ul a { color: darkgreen; text-decoration: none; } #header, #footer { font-size: large; padding: 0.3em; background: #BCCE98; } #left { background: #DAE9BC; } #right { background: #F7FDEB; } #center { background: #fff; } #container .column { padding-top: 1em; }<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!--<meta http-equiv="X-UA-Compatible" content="ie=edge">--> <link href="css/bootstrap.min.css" rel="stylesheet"> <title>PROBANDO UNA WEB</title> </head> <body> <header id="header"> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container"> <!-- Navbar links --> <div class="collapse navbar-collapse" id="navbar"> <ul class="nav navbar-nav"> <li class="active"> <a href="#">PRINCIPAL</a> </li> <li> <a href="#">CASA</a> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Recursos <span class="caret"></span></a> <ul class="dropdown-menu" aria-labelledby="about-us"> <li><a href="#">PRODUCTOS</a></li> <li><a href="#">NOTICIAS</a></li> <li><a href="#">RECURSOS</a></li> </ul> </li> </ul> <!-- Search --> <form class="navbar-form navbar-right" role="search"> <div class="form-group"> <input type="text" class="form-control"> </div> <button type="submit" class="btn btn-default">Search</button> </form> </div> <!-- /.navbar-collapse --> </div> <!-- /.container --> </nav> </header> <div id="container"> <main id="center" class="column"> <article> <h1>SEAN BIENVENIDOS A MI SITIO WEB...</h1> <p>HOLA, ESTOY EMPEZANDO EN EL DESARROLLO WEB</p> <h2>CURRICULUM</h2> <h2>ESPEDIENTE ACADEMICO</h2> <p>AQUI QUIERO PONER LOS ESTUDIOS REALIZADOS<a href="proyectos-4.html">humilde aplicacion.</a></p> <h2>EXPERIENCIA</h2> </article> </main> <nav id="left" class="column"> <h3>DATOS PERSONALES</h3> <ul> <li><a target="_blank" href="#"TRABAJO</a></li><br> <li><a target="_blank" href="#">DIPLOMATURAS</a></li><br> </ul> <br> <br> </nav> <div id="right" class="column"> <h3>FOTO DE PERFIL</h3> </div> </div> <!-- <div id="footer-wrapper"> <footer id="footer"><p>Footer...</p></footer> </div>--> </body> </html>
