Hola a todos!
Estoy realizando un proyecto web ayudándome de Bootstrap para que se adapte fácilmente a todos los dispositivos, pero soy un poco novato en su uso. Mi problema es que necesito alienar horizontalmente los elementos del encabezado de la página para que no quede feo, sin perder las propiedades de bootstrap al reducir el tamaño. Por ahora tengo el siguiente código:
Mí código html:
Código HTML:
<header>
<div class="container">
<div id="titulo" class="col-xs-12 col-md-3">
<h1>HPG-Aligner</h1>
</div>
<div id="logoUniversitatValencia" class="col-xs-12 col-md-4">
<img src="imagenes/universitatValencia.png" class="img-responsive" alt="Universitat de València">
</div>
<div id="usuarioRegistrado" class="col-xs-12 col-md-3 col-md-offset-2">
<p>Ningún usuario logueado.</p>
</div>
</div>
</header>
Mi código CSS (además del código original de Bootstrap):
Código:
body
{
background-color: white !important;
}
header
{
background-color: #202020 !important;
}
#titulo
{
color: white;
}
#usuarioRegistrado
{
color: white;
}
El resultado que tengo ahora mismo es este, necesito que los elementos del encabezado estén centrados horizontalmente.