Происходит слипание блоков <p> в мобильной версии сайта. @midea запросы прописаны

187
26 марта 2019, 09:20

Совсем новенький в этом, плюс верстка не моя, сайт не мой. Знаю что HTML & CSS грязный.

Собственно попросили добавить инфу в "Контакты", добавил, но в мобильной версии теперь идет слепка всех их.

Знаю, что через media запросы нужно сделать, но они уже прописаны были. Как можно это исправить?

Код, который я думаю с @media запросами: Все что смог понять и найти в этом бардаке.

    /* Map-area Start */ 
    .section-title-heading { 
        padding: 0px 12px; 
    } 
    .map-location-area .getstarted-btn { 
        left: 26%; 
    } 
    .map-location-area { 
        background: transparent; 
        padding: 80px 0; 
        padding-top: 0; 
        background-position: bottom right; 
    } 
    .single-location.toronto { 
        width: 80%; 
        text-align: left; 
        left: 0; 
        position: relative; 
        margin-top: 0; 
    } 
    .single-location.toronto { 
        /*! display: inline-flex; */ 
        background: #fff; 
        z-index: 9; 
    } 
    .single-location h6 { 
        float: left; 
    } 
    .single-location { 
        height: 85px; 
        border-bottom: 1px solid #efefef; 
        padding-top: 10px; 
        background: #fff; 
        width: 100% !important; 
        padding-left: 35px; 
    } 
    .single-location.sanfrancisco { 
        position: relative; 
        width: 80%; 
        margin-top: 0; 
        left: 0; 
    } 
    .single-location.newyork { 
        position: relative; 
        margin-top: 0; 
        left: 0; 
        width: 80%; 
    } 
    .single-location.london { 
        position: relative; 
        margin-top: 0; 
        margin-left: 0; 
        width: 80%; 
    } 
    .single-location.singapore { 
        position: relative; 
        width: 80%; 
        right: 0; 
        margin-top: 0; 
    } 
    .map-dropdown-address { 
        margin-left: 15px; 
    } 
    .map-dropdown-address a { 
        color: #2079ff; 
    } 
    .Dropdown-content { 
        display: -webkit-inline-box; 
        display: -ms-inline-flexbox; 
        display: inline-flex; 
        width: 74%; 
        float: right; 
        position: relative; 
        right: 15px; 
        bottom: 23px; 
        background: transparent; 
        box-shadow: none; 
    } 
    .Dropdown-content { 
        display: -webkit-inline-box; 
        display: -ms-inline-flexbox; 
        display: inline-flex; 
        width: 66%; 
        float: right; 
        position: relative; 
        right: 15px; 
        bottom: 23px; 
        background: transparent; 
        box-shadow: none; 
        opacity: 1; 
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
        visibility: visible; 
    } 
    /* Map-area End */
 <!-- map start --> 
    <section id="contacts"> 
    <section class="map-area"> 
        <div class="container section-padding"> 
            <div class="section-heading"> 
                <div class="row"> 
                    <div class=".col-xs-6 .col-sm-4"> 
                        <div class="section-title-heading"> 
                            <h2 style=" 
       font-size: 2.7em 
    font-weight: 250; 
">Контакты</h2><br>   
                    <p style=" 
    font-size: 1.6em; 
    line-height: 30px; 
                                                                             
" class="col-xs- col-md-4" style="margin-bottom: -15px;">г. Санкт-Петербург<br> 
                    Наш телефон: <br><a href="tel:+79215979995">+7-921-597-99-95</a><br> 
                    Наша почта: <a href="mailto:za@nordint.ru">za@nordint.ru</a> 
                    </p> 
                       <p style=" 
    font-size: 1.6em; 
    line-height: 30px; 
     
" class="col-xs- col-md-4 " style="margin-bottom: -15px;">420061, РТ, г. Казань, ул. Лево-Булачная, дом №52, офис №12.<br> 
                              Наш телефон: <br><a href="tel:+7963237823">+7-963-23-78-23</a><br> 
                               Наша почта:<a href="mailto:rs@nordint.ru">rs@nordint.ru</a><br> 
                               </p> 
 
                        <p style=" 
    font-size: 1.6em; 
    line-height: 30px; 
                                                           
" class="col-xs- col-md-4" style="margin-bottom: -15px;">г. Москва<br> 
                                     Наш телефон: <br><a href="tel:+79033877871">+7-903-387-78-71</a><br> 
                                     Наша почта:<a href="mailto:nk@nordint.ru">nk@nordint.ru</a> 
                                     </p> 
                        </div>

Answer 1

Наверное что типа такого

    @media (max-width: 576px) { //применять стили до ширины 576px
        .section-title-heading p{
               margin-bottom: 15px;
    }
}
READ ALSO
Прокрутка в календаре

Прокрутка в календаре

Как можно сделать прокрутку в этом календаре ? (прокрутка должна быть только у sidebar)

165
Тонкая рамка border вокруг блока тоньше 1px

Тонкая рамка border вокруг блока тоньше 1px

Как сделать очень тонкую рамку вокруг блока, чтобы она была визуально тоньше 1px? Понимаю, что по факту тоньше 1px нельзя установить border-width, но может...

189
Регулярное выражение для логина C#

Регулярное выражение для логина C#

Есть регулярное выражение

170
Settings SpecializedCollections где хранится?

Settings SpecializedCollections где хранится?

Угораздило поправить файл Settings руками, параметр имеет тип SpecializedCollections, поменял как вsettings так и в

154