Custom columns in bootstrap and grid layout, how to configure?

Question

HTML

Hello, I have such a question, I'm typing according to a psd layout, in photoshop the grid lines are set up so that they appear every 30px. I found an application for chrome - Design Grid Overlay which builds a grid. But the application does not have such a setting as "a line every 30px", there is a setting for the number of columns and gutters internal and external.
I set up the Design Grid Overlay like this: the number of columns: 48 (because in the psd layout at 1440px it turns out 48 columns of 30px each) and internal gutters: 1. Thus, I got a grid like in photoshop.
Then I used PerfectPixel by WellDoneCode and looked at how the grid looks in the picture, everything is fine, identical to the grid in photoshop.
Next compiled custom bootstrap column count = 48 and grid-gutter-width = 20px,
then I made a markup where I decided to check different column sizes in html, but for some reason they do not match. Example https://yadi.sk/i/fzplbOjy32GhjQ - orange color - grid columns, other colors are layout using bootstrap columns, red and green color is 1 bootstrap column.
html: The parent of the element with class row is body, width of row and body is 100%.
I suspect that I configured the custom bootstrap incorrectly, but I can’t understand where I messed up, tell me?

Answer 1

Somehow I quickly got to the bottom of the problem, I forgot to specify .container-fluid. I made a screenshot of an example: on top using container-fluid, on the bottom without. https://yadi.sk/i/5ZkB8Exo32GmYz
If anyone needs it, I won't delete the post.

Answer 2

If you want a fixed width, then row must be inside .container and .container must have the corresponding width in pixels. The question is different, but who makes sites with a fixed container today? I think you need to move from px to %.

Answer 3

What happened to gridpak.com?
Site unavailable.
Throw off, please, if anyone has left in stash!