<div class="container" style="background: yellow;">
<div class="row">
<div class="col-md-8 col-md-offset-2" >
<div class="panel panel-primary">
<div class="panel-heading">
</div>
<div class="panel-body"></div>
</div>
</div>
</div>
</div>
Is this the best way to set a customizable width within a container?
<div class="col-md-8 col-md-offset-2" >
Using the columns you set the width using the bootstrap grid.
If this width is good for you use it. Otherwise adjust to the desired size.
You can also set a fixed width with width, but it is better to use the columns because they are adjustable.
It all depends on the final product you want, it's quite relative ... If you want to please every size of screen, I suggest using only class="col-8" that way it will work for all kinds of screens, xl , lg , md , sm , xm ...
The way you did, you are specifying the size for medium-sized monitors only. But it's like I said, it depends on your need! If the focus of the site is this, it is correct, otherwise, up there my suggestion!
In both ways you are making a responsive website, which is great nowadays, since many people access the sites by cell phone, computer or even televisions ...
Hug, congratulations on the project, any questions I am at your disposal!
Bootstrap breaks down into 12 divisions per screen percent. Through col-x you say how many parts your column should occupy.
col-lg-x ,
col-md-x ,
col-sm-x ,
are specifications according to screen size ... lg > md > sm