Zip
November 23, 2017, 12:21pm
1
ok @nourabousoha check this out
<div class="row">
<div class="col-md-2"></div>
<div class="btn-group btn-group-lg col-md-8" >
<button type="button" class="btn btn-primary">Left</button>
<button type="button" class="btn btn-primary">Middle</button>
<button type="button" class="btn btn-primary">Right</button>
<button type="button" class="btn btn-primary">Right</button>
</div>
<div class="col-md-2"></div>
</div>
I can’t get my btn-group in the center of the page lol
use the offset* classes to push your btn-group in the middle
1 Like
Zip
November 23, 2017, 12:28pm
3
offset? ok let me check that doc.
is that how I should do it in all cases with stuff like this?
I feel like griding my stuff should’ve worked…
So you want the button group in the middle of the whole page or the middle of the col-md-8
?
1 Like
Zip
November 23, 2017, 12:30pm
6
@nourabousoha
My buddy showed me this so I just used that. But I’m gonna check that offset stuff. I gotta learn more about flex.
#button-group {
margin: auto;
display: flex;
flex-direction: row;
justify-content: center;
}
Zip
November 23, 2017, 12:31pm
7
well @BenGitter
the way I figure it if I put it in the middle 8 slots it would be in the center of the page.
But yea lol. I want it in the center of the page.
yes like this <div class="col-md-2 col-md-offset-2"></div>
1 Like
Just use col-md-12
+ text-center
and then inside a div of btn-group
:
<div class="row">
<div class="col-md-12 text-center">
<div class="btn-group btn-group-lg">
<button type="button" class="btn btn-primary">Left</button>
<button type="button" class="btn btn-primary">Middle</button>
<button type="button" class="btn btn-primary">Right</button>
<button type="button" class="btn btn-primary">Right</button>
</div>
</div>
</div>
1 Like
Zip
November 23, 2017, 12:33pm
10
I don’t understand that code @nourabousoha
what’s happening there?
Zip
November 23, 2017, 12:35pm
11
BenGitter:
type
So if I got you right @BenGitter , this would center everything in my col-md-12 box. right?
Yes, all text (including buttons) is centered.
1 Like
Zip
November 23, 2017, 12:37pm
13
HAHAHA IT WORKED!
dam i’m good
Zip
November 23, 2017, 12:38pm
14
OMG @BenGitter I think that’s gonna solve all my grid problems from now on. I knew it had to be easy.
See the way I look at this bootstrap business is like a magazine.
Ya’ know, like you can lay everything out in grids.
And that’s how I wana code.
tx for your help too @nourabousoha
it’s just an example of one of the offset classes family.
the answer to those kind of problem is to calculate how to reatch the center of your thing (page div …etc) and use
a combination of col* and col-offset* to reach it.
1 Like