tklustig
(Kipp Thomas)
January 14, 2018, 12:00am
1
Hi guys,
following bootstrap CSS rule will order my checkboxes in my formular side by side
<div class="col-sm-2">
<?=
$form->field($model, 'arbeitsumfang_teilzeit')->widget(\kartik\checkbox\CheckboxX::classname(), [
'autoLabel' => true
])->label(false);
?>
</div><div class="col-sm-2">
.
.
.
Same rule for DropDownboxes fails. I only found following rule ordering 2 DropdownBoxes side-by-side
<div class="col-md-6">
.
.
</div> <div class="col-md-6">
.
.
</div>
My intention is to set three or better four DropDownBoxes side-by-side.
Unfortunately, i didn’t succeed finding any rule.
Any ideas,which rule I colud use in order to set three/four DropDonBoxes,TextInput-fileds etc…
side by side?
jimgwhit
(Kpsklab)
January 14, 2018, 2:01am
2
Sounds like you need to learn more about css.
Look at float: left;
https://www.w3schools.com/css/css_float.asp
But you need to clear floats also, working with floats can be tricky.
In fact getting all correct with css is one of the trickiest
parts of a website.
tklustig
(Kipp Thomas)
January 14, 2018, 2:38am
3
Sounds like you need to learn more about css.
Look at float: left;
https://www.w3school …s/css_float.asp
But you need to clear floats also, working with floats can be tricky.
In fact getting all correct with css is one of the trickiest
parts of a website.
Ur suggestion is nonsense. I’m using yii2 as a framework which will give me all css rules needed. It’s absolutely ineffective writing own css rules as float:left,float:right etc…
alirz23
(Alirz23)
January 14, 2018, 8:08am
4
bootstrap grid is based on 12 column layout so if you would like to inline 4 dropdowns you need to break it down accordingly
for 2 inline columns as you already have it (6 * 2 = 12)
<div class="col-md-6">
</div>
<div class="col-md-6">
</div>
to make 4 columns (3 * 4 = 12)
<div class="col-md-3">
</div>
<div class="col-md-3">
</div>
<div class="col-md-3">
</div>
<div class="col-md-3">
</div>
to make six dropdowns inline (2 * 6 = 12 )
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
tklustig
(Kipp Thomas)
January 14, 2018, 9:06am
5
bootstrap grid is based on 12 column layout so if you would like to inline 4 dropdowns you need to break it down accordingly
for 2 inline columns as you already have it (6 * 2 = 12)
<div class="col-md-6">
</div>
<div class="col-md-6">
</div>
to make 4 columns (3 * 4 = 12)
<div class="col-md-3">
</div>
<div class="col-md-3">
</div>
<div class="col-md-3">
</div>
<div class="col-md-3">
</div>
to make six dropdowns inline (2 * 6 = 12 )
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
<div class="col-md-2">
</div>
So , if I want three elements, I get following equation:
3*x=12=>x=4=>col-md-4
Is that correct?
Where could I get informed online about diffent designations of CSS-rules(for instance col-lg/col-lg-offset/col-sm etc…etc…) without inverstigate rules in bootstrap-file?
jimgwhit
(Kpsklab)
January 15, 2018, 3:04am
6
What do you think bootstrap uses?
First, you should never use a library until you know the basic code.
Same for javascript. Learn basic css before delving into a css library.
Question, would you want a surgeon operating on you without all the training they have to have? NO.
So I would not want a developer working on something unless they knew the "basics" of the code they are using.
I guess small hobby blogs are fine.
alirz23
(Alirz23)
January 15, 2018, 9:03am
7
Where could I get informed online about diffent designations of CSS-rules(for instance col-lg/col-lg-offset/col-sm etc..etc..) without inverstigate rules in bootstrap-file?
bootstrap docs is your best bet it has very detailed page on the grid here is a link
Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, five default responsive tiers, Sass variables and mixins, and dozens of predefined classes.
tklustig
(Kipp Thomas)
January 17, 2018, 7:16pm
8
[size="2"]
[/size]
Where could I get informed online about diffent designations of CSS-rules(for instance col-lg/col-lg-offset/col-sm etc..etc..) without inverstigate rules in bootstrap-file?
bootstrap docs is your best bet it has very detailed page on the grid here is a link
https://getbootstrap …0/layout/grid/
Thx for this!
Without U,samdark and umneeq this forum were very poor.
With U, it’s a marvelous place to get problems solved
Go ahead…
This thread can be closed as succesfully solved