CODEWITHSUNDEEP
htmlcssbootstrap-4
Leed
Leed

Reputation: 303

Bootstrap 4: between col-lg and col-md sizes

So i am creating a tribute page in which you can view here --> https://codepen.io/Mike-was-here123/pen/xpEqWX

This is all based on the jumbotron in which you can find on lines 2 & 3 of the code.

This is col-lg-8 with offset-lg-2 to center it, 1920px width:

This is also col-lg-8 in effect, with a width of 993px:

Then it finally switches over to col-md-12 at around 990px. This now makes it so the jumbotron takes up all 12 columns giving the text more space:

As you can see, there is lots of range for the lg. It has the same affect at 1000px as 1920px. This can make it annoying as my lg setting looks good at 1920px, but by around 1000px it still hasn't switched over to md, causing the images to be awkwardly small. This is around a 1000px difference and is messing me up. Is there anyway i can go in between lg and md, and so with any other size? Is it a class like col-lg- that i can use to maybe add 10 columns and 1 offset at the halfway point between lg and md? Would i have to check using @media (css) to then change the columns that way if possible?

Upvotes: 0

Views: 2900

Answers (2)

duy nguyen
duy nguyen

Reputation: 79

just use

<div class="col-xs-12 col-lg-6">

Upvotes: 0

hayden
hayden

Reputation: 2753

Instead of

<div class="col-lg-6 col-md-12 col-sm-12 col-xs-12">

could you use?

<div class="col-xl-6 col-lg-12 col-md-12 col-sm-12 col-xs-12">

Upvotes: 1

Related Questions