Sorry for replying to an old comment, but hopefully I can help others who might come across this!
1) You can add mr-1 as a class for all of your columns. mr-1 means you would set a margin space on the right side of your selected column. So, based on your code, you would have something like <div class="card col-1 p-1 mr-1">col-1</div> The downside to this is that you run the risk of your row of columns breaking into a new line.
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
Which brings us to the second option!
2) You can leave the columns as is, but you would remove card from the column's class while leaving p-1 in your original code. You would then add another <div> with the card and p-1 classes within the column. So, based on your code, you would get something like <div class="col-1 p-1"><div class="card p-1">col-1</div></div>
The only downside is that it's more code to add and your columns get slightly thinner, but at least all of them will stay in the same row:
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
col-1
Putting spaces between columns can depend on what you want for your columns in a row, so be sure to experiment and see what works for you and how you want your layout to look. I hope this helps!
Sorry for replying to an old comment, but hopefully I can help others who might come across this!
1) You can add
mr-1
as a class for all of your columns. mr-1 means you would set a margin space on the right side of your selected column. So, based on your code, you would have something like<div class="card col-1 p-1 mr-1">col-1</div>
The downside to this is that you run the risk of your row of columns breaking into a new line.Which brings us to the second option!
2) You can leave the columns as is, but you would remove
card
from the column's class while leavingp-1
in your original code. You would then add another<div>
with thecard
andp-1
classes within the column. So, based on your code, you would get something like<div class="col-1 p-1"><div class="card p-1">col-1</div></div>
The only downside is that it's more code to add and your columns get slightly thinner, but at least all of them will stay in the same row:
Putting spaces between columns can depend on what you want for your columns in a row, so be sure to experiment and see what works for you and how you want your layout to look. I hope this helps!
2 months, 10 days ago Edited 8:38 am