Change the width of the loading container

Question

I am using Bootstrap for my website and I need to create a container with a size of 1250 pixels, but the problem is that when I change the class of the Bootstrap container, the response will no longer work.

What should I do?

Answer 1

You can create a custom container and use it with the default container (just by rewriting the width). You can change the width to suit your needs:

CSS:

@media (min-width: 768px) { .my-custom-container{ width:600px; }} @media (min-width: 992px) { .my-custom-container{ width:720px; }} @media (min-width: 1200px) { .my-custom-container{ width:900px; }} 

HTML:

 <div class="container my-custom-container"> your content Goes here ....... </div> 

Answer 2

Just a container-liquid installation will create a container 100% wide. Wrapping everything in a 1250px wide container will cause your container to not respond. It’s best to set a “maximum width” for your liquid container, I have included the markup below:

 <div class="container-fluid" style="background-color:#CDCDCD; max-width:1250px"> 

Liquid container

Answer 3

Have you tried the bootstrap container?

Try changing the "container" to "container-liquid"

This can help

Answer 4

You can change the width of the container as you like. To do this, add these css lines

 @media (min-width: 1200px) { .container { width: 1250px !important; } } 

thanks

Answer 5

You can change the width of the container as you wish. To do this, add these css lines:

 .container{ max-width:1250px; width:100%; } 

Answer 6

Put a special class, for example my_custom_menu , in your menu container. then copy this style below into the stylesheet ....

 @media (min-width: 1200px) { .container.my_custom_menu { width: 1250px; } } 

thanks

Answer 7

You can specify the width of the container in the css file:

 .container { width:1250px; } 

Then write a multimedia query to make it responsive:

 @media only screen and (max-width : 1249px ) { .container { width:100%; } }