Margin bottom en div de bootstrap
Iniciado por
Luis Veron
, may 07 2015 18:12
Solución elegida por el autor
Iniciado por
George10
, 07 mayo 2015 - 21:52
Hice algunas modificaciones a tu HTML que deberian funcionarte sin problemas:
<div class="leftbar row" style="margin-top:10px;">
<div class="col-xs-4 text-center" style="background:#ffc016; height:150px;">
Nombre empresa
</div>
<div class="col-xs-8">
<a href="#" class='pull-right'>
<i class="glyphicon glyphicon-heart-empty"></i>
</a>
<h4>Titulo</h4>
<ul class="row">
<li class="col-xs-3">
<small>Nike Inc</small>
</li>
<li class="col-xs-3">
<small>England</small>
</li>
<li class="col-xs-3">
<small>Internship</small>
</li>
</ul> </div>
<div class="btn-group bottom-right" role="group" aria-label="...">
<span class="btn btn-default monthly">
<small>Guardar</small>
</span>
<a class="btn btn-default applynow">
Ver
</a>
</div>
</div>
Adicionalmente, debes incluir un poco de CSS para que logres lo que deseas:
.leftbar {
position: relative;
}
.bottom-right {
position: absolute;
bottom: 0;
right: 15px;
}
Espero te sea de ayuda. Saludos.
Ver solución completa
Pulsa corazón para recibir avisos de nuevas Respuestas
Luis Veron
AUTOR PREGUNTA
#1
Publicado 07 mayo 2015 - 18:12
Alguien sabe como puedo setear el margin bottom en un div con las clases de row de bootstrap, he intentado de muchas formas pero sin exito alguno. Me gustaria que mi fila este al fondo. Alguna idea?
Esto también te interesa!
George10
#2
Publicado 07 mayo 2015 - 21:47
Podrias colocar tu codigo, de esa forma te podemos ayudar de mejor forma
Luis Veron
AUTOR PREGUNTA
#3
Publicado 07 mayo 2015 - 21:48
Aqui les dejo el codigo, gracias de antemano:
<div class="leftbar" style="margin-top:10px;">
<div class="row">
<div class="col-md-4">
<div style="background:#ffc016; height:150px;">
<div class="text-center">
Nombre empresa
</div> </div>
</div>
<div class="col-md-8">
<div class="row">
<div class="col-md-10">
<h4>Titulo</h4>
</div>
<div class="col-md-2 text-right heart"><a href="#"><span class="glyphicon glyphicon-heart-empty"></span></a></div>
</div>
<div class="row">
<div class="col-md-3"><small>Item 1</small></div>
<div class="col-md-3"><small>Item 2</small></div>
<div class="col-md-3"><small>Item 3</small></div>
<div class="col-md-3"><small>Item 4</small></div>
</div>
<div class="row thisrow">
<div class="col-md-2"> </div>
<div class="col-md-10 text-right heart">
<div class="btn-group" role="group" aria-label="...">
<span class="btn btn-default monthly"><small>Guardar</small></span>
<a class="btn btn-default applynow">Ver</a>
</div>
</div>
</div>
</div>
</div>
</div>
Borja
#4
Publicado 07 mayo 2015 - 21:51
Puedes probar con el margen en la division del boton de la siguiente forma:
<div class="btn-group" role="group" aria-label="..." style="margin-top:_px">
<span class="btn btn-default monthly"><small>Guardar</small></span>
<a class="btn btn-default applynow">Ver</a>
</div>
Respuesta de
Borja
Cuenta Std
20
George10
#5
Publicado
07 mayo 2015 - 21:52
Hice algunas modificaciones a tu HTML que deberian funcionarte sin problemas:
<div class="leftbar row" style="margin-top:10px;">
<div class="col-xs-4 text-center" style="background:#ffc016; height:150px;">
Nombre empresa
</div>
<div class="col-xs-8">
<a href="#" class='pull-right'>
<i class="glyphicon glyphicon-heart-empty"></i>
</a>
<h4>Titulo</h4>
<ul class="row">
<li class="col-xs-3">
<small>Nike Inc</small>
</li>
<li class="col-xs-3">
<small>England</small>
</li>
<li class="col-xs-3">
<small>Internship</small>
</li>
</ul> </div>
<div class="btn-group bottom-right" role="group" aria-label="...">
<span class="btn btn-default monthly">
<small>Guardar</small>
</span>
<a class="btn btn-default applynow">
Ver
</a>
</div>
</div>
Adicionalmente, debes incluir un poco de CSS para que logres lo que deseas:
.leftbar {
position: relative;
}
.bottom-right {
position: absolute;
bottom: 0;
right: 15px;
}
Espero te sea de ayuda. Saludos.
Luis Veron
AUTOR PREGUNTA
#6
Publicado 08 mayo 2015 - 05:17
Gracias crack! como anillo al dedo