Went layout bootstrap, why?

Guys, help solve the problem.. At 992 - 1200px rides layout... Central blocks stick together... Why?

Should be like this:
5bbf112087178580204545.png
And I have so...
5bbf114d92bc2624940319.png
<div class="container m-auto">
 <div class="row mobile-slider">
 <div class="col-lg-3 col-md-5 col-8 ml-auto">
 <div class="projects_block">
 <img src="img/redline.png" alt="">
 <h3 class="projects_block_heading">
 Red Line & Power China
</h3>
 <p class="projects_block_paragraph">
 The joint venture company <a target="blank" class="projects_block_link_redline" href="https://skrl.ru">"Red Line"</a> and "Power China Guiyang Engineering 
 Corporation limited", in order of development 
 orders fuel and energy complex 
 <br / >in Russia.
</p>
 <a target="blank" class="redline" href="docs/RedLine.pdf">RedLine.pdf</a>
 <a target="blank" class="powerchina" href="docs/PowerChina.pdf">PowerChina.pdf</a>

</div>
</div>
 <div class="col-lg-3 col-md-5 col-8 mr-auto">
 <div class="projects_block">
 <div class="projects_block_imgs">
 <a href="img/slider/3.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 3.jpg" alt=""></a>
 <a href="img/slider/2.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 2.jpg" alt=""></a>
 <a href="img/slider/1.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 1.jpg" alt=""></a>
 <a href="img/slider/4.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 4.jpg" alt=""></a>
 <a href="img/slider/5.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 5.jpg" alt=""></a>
 <a href="img/slider/6.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 6.jpg" alt=""></a>
 <a href="img/slider/7.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 7.jpg" alt=""></a>
 <a href="img/slider/8.jpg" data-lightbox="roadtrip"><img class="projects_block_img" src="img/
 8.jpg" alt=""></a>
</div>
 <h3 class="projects_block_heading projects_block_heading_overlay">
 Russian village
</h3>
 <p class="projects_block_paragraph">
 Together with Chudzinski international travel Corporation, are developing projects of wooden houses in Russian style, for the construction of the tourist town 
 <br / >on the mountain of the Lotus in the city <br>hair-Doo.
</p>
</div>
</div>
 <div class="projects_block_margin col-lg-3 col-8 col-md-5 ml-auto">
 <div class="projects_block">
 <img src="img/chun.png" alt="">
 <h3 class="projects_block_heading">
 Cunit - SPSU
</h3>
 <p class="projects_block_paragraph">
 "Chongqing University of science and technology Saint-Petersburg mining University": means
 contacts shopping
 of Commerce between universities organized close cooperation.
</p>
</div>
</div>
 <div class="projects_block_margin col-lg-3 col-8 col-md-5 mr-auto">
 <div class="projects_block">
 <img src="img/saqr.png" alt="">
 <h3 class="projects_block_heading">
 saqr trevel
</h3>
 <p class="projects_block_paragraph">
 Tour operator <a target="blank" class="projects_block_link_saqr" href="https://saqrtravel.com">"Saqr travel Saint-Petersburg"</a>, is a representative of an international company
 "Saqr travel". We welcome tour groups 
 <br / >and individuals in St. Petersburg, as well as 
 <br / >throughout Russia.
</p>
</div>
</div>
</div>
</body>
</html>

.projects {
 background: url(../img/projects.png) no-repeat center top /cover;
 padding: 1px;
 min-height: 680px;
}
.projects_block_heading {
 font-size: 16px;
 font-weight: 700;
 margin: 20px 0 0 10px;
 text-transform: uppercase;
 padding-left: 24px;
}
.projects_block {
 background: #fff;
 min-width: 270px;
 min-height: 479px;
 position: relative;
}
.projects_block_imgs img {
 width: 270px;
 height: 226px;
 vertical-align: top;
}
.projects_heading {
 font-size: 24px;
 font-weight: 600;
 color: #fff;
 text-align: center;
 text-transform: uppercase;
 margin: 40px 0;
 letter-spacing: 0.15 rem;
}
.projects_block_paragraph {
 font-size: 14px;
 font-weight: 400;
 padding: 0 15px 0 24px;
 line-height: 18px;
}
.projects_block_imgs:before {
 background: url(../img/zoom.png) no-repeat center center;
 pointer-events: none;
 content: ";
 position: absolute;
 width: 100px;
 height: 100px;
 top: 50%;
 margin-top: -50px;
 left: 50%;
 margin-left: -50px;
 opacity: 0;
 cursor: pointer;
}
.close_slider {
 width: 30px;
 height: 30px;
 z-index: 8;
 position: absolute;
 top: 0;
 right: 0;
}
.projects_block_imgs:hover:before {
 opacity: 1;
 transition: all 0.4 s;
 cursor: pointer;
 z-index: 10;
 outline: none;
}
.slick-prev {
 background: url(../img/left.png) no-repeat;
 width: 13px;
 height: 23px;
 top: 41%;
 margin-left: 37px;
 z-index: 5;
}
.slick-prev:focus {
 outline: none;
}
.slick-next {
 background: url(../img/right.png) no-repeat;
 width: 13px;
 height: 23px;
 top: 41%;
 margin-right: 37px;
 z-index: 5;
}
.slick-next:focus {
 outline: none;
}
.projects_block_img_slider {
 min-height: 1px;
 min-width: 1px;
}
#footer {
 background: #27365d;
 padding-bottom: 30px;
}
.footer_contacts_heading {
 font-size: 24px;
 font-weight: 600;
 color: #fff;
 text-transform: uppercase;
 letter-spacing: 0.15 rem;
 margin: 28px 0 15px 0;
}
.footer_contacts_phone,
.footer_contacts_mail,
.footer_contacts_site {
 color: #fff;
 font-size: 16px;
 font-weight: 600;
 align-items: center;
 margin-top: 15px;
 letter-spacing: 0.1 rem;
}
.footer_contacts_phone_number,
.footer_contacts_mail_email,
.footer_contacts_site_isite {
 margin-left: 10px;
}
.footer_contacts_mail {
 margin-left: -30px;
}
.powerchina,
.redline {
 font-size: 12px;
 font-weight: 700;
 color: #a13148;
}
.redline {
 margin-left: 24px;
}
.powerchina {
 margin-left: 13px;
}
.projects_block_link_redline:hover,
.projects_block_link_saqr:hover {
 color: #87264d;
}
.slick-slide {
 border: none;
 outline: none;
}
@media screen and (max-width: 992px) {

}

@media screen and (max-width: 992px) {
 .main_menu_list_item a {
 font-size: 14px;
 letter-spacing: 0.1 rem;
 padding: 0;
}
 .background-image {
 background: url(../img/log.png) no-repeat 140px center /cover;
 background-size: 764px;
}
 .header__heading_span {
 font-size: 22px;
 letter-spacing: 0.1 rem;
}
 .header__heading_head {
 font-size: 38px;
 margin-top: 5px;
 font-weight: 900;
 letter-spacing: 0.14 rem;
}
 .header__heading {
 padding: 220px 0 0 211px;
}
 .header__about_paragraph {
 line-height: 20px;
 letter-spacing: 0.01 rem;
}
 .projects_block:nth-child(3) {
 margin-top: 50px !important;
}
 .projects_block_margin {
 margin: 40px 0 0 47px;
}
 .footer_contacts_logo {
 margin-top: 20px;
}
 .footer_contacts_site {
 margin-left: 110px;
 margin-top: -15px;
}
.footer_contacts_phone,
 .footer_contacts_mail {
 margin: 0;
 margin-left: -10px;
}
 .projects_block_imgs::before {

 background: url(../img/zoom_md.png) no-repeat center center;
 pointer-events: none;
 content: ";
 position: absolute;
 width: 34px;
 height: 34px;
 top: 10%;
 margin-top: -17px;
 left: 90%;
 margin-left: -17px;
 opacity: 0;
 cursor: pointer;
}


@media screen and (max-width: 768px) {
 .main_menu_list_item a {
 font-size: 10px;
 letter-spacing: 0;
}
 .main_menu_list_item {
 padding: 0 1px;
}
 .phone_number {
 font-size: 12px;
}
 .phone_img img {
 width: 18px;
 height: 16px;
}
 .header__phone {
 margin-top: 25px;
}
 .header__heading_span {
 font-size: 14px;
 font-weight: 900;
 letter-spacing: 0.04 rem;
}
 .background-image {
 background: url(../img/header_mob.png) no-repeat center 100px;
}
 .header__heading {
 padding: 120px 0 120px 0;
}
 .header__heading_head {
 font-size: 26px;
 letter-spacing: 0.03 rem;
}
 .header__about_heading {
 font-size: 20px;
}
 .header__about_paragraph {
 font-size: 16px;
 letter-spacing: 0.1 rem;
}
 .projects_heading {
 font-size: 20px;
}
 .col-8 {
 margin: 0 auto !important;
}
 .projects_block {
 max-width: 310px;
 margin: 0 auto;
}
 .projects_block img {
 width: 100%;
}
.footer_contacts_site,
.footer_contacts_mail,
 .footer_contacts_phone {
 margin: 0 0 0 96px !important;
}
 .footer_contacts_phone {
 margin-top: -55px !important;
}
 .footer_contacts_mail {
 margin-top: -9px !important;
}
 .footer_contacts_site {
 margin-top: 17px !important;
}
 .footer_contacts_heading {
 font-size: 20px;
}
}
March 12th 20 at 08:40
3 answers
March 12th 20 at 08:42
that this was not better not to impose the bootstrap :))))))))))
Very norms with bootstrap typeset, just need to know how to use it. - Jalyn commented on March 12th 20 at 08:45
@Jalyn, the issue is not the ability, and the desire kopatsya ton of someone else's shit. I have no such desire, so I yuzayu Tailwind - Elissa_Weissnat88 commented on March 12th 20 at 08:48
@Elissa_Weissnat88, Tell bekendste that sawing project on YII, for example))) to be able to use a variety of technologies very useful - Jalyn commented on March 12th 20 at 08:51
@Jalyn, Tailwind and written by bekendste. Bootstrap not bekendste, and for Gulnara, out we of his profession - Elissa_Weissnat88 commented on March 12th 20 at 08:54
I will say this... I'm not tech guru, but I initially refused any a La libraries to simplify life and 2 years later I'm glad I don't know them and don't want to know. People who want to learn something will advise to delve into the depths and you will be happy and snippets and understanding. Not to use bootstrap which lives on patterned and flat methods, a quality product you never napishete using these libraries - Lilly97 commented on March 12th 20 at 08:57
March 12th 20 at 08:44
before /body div is not closed
Yes, I was just cut out.. There are more than 30 characters so it is impossible.. I Removed the code in chaos. - Ellie_Quitzon commented on March 12th 20 at 08:47
@Ellie_Quitzon, then MB put it in the sandbox? - Margret58 commented on March 12th 20 at 08:50
March 12th 20 at 08:46
.projects_block {
 min-width: 270px; /* should be removed */
}

Stick together because min-width is registered. You can't do that, why do you need bootstrap at all if you rigidly fix the minimum width?
And Yes, use the sandbox, no one will copy your pieces and test themselves to assist you, it is done in 3 minutes.

Find more questions by tags BootstrapHTMLCSS