Как выровнять блоки?

Question

[squirtazzer]

z-mesta.com
Как выровнять первый блок(со сканом)в правом виджете боковой колонки,с остальными?такие как контакты,и т.д

Answer 1

[Aleks Front]

У блоков контакты и т.д. те что ниже сертификатов убрать классы col-* так как они у них прописан padding-left и padding-right СКРИН . Открыть документацию бутстрап и почитайте о сетке. .col-* не может сущестсовать без явного родителя .row. Т.е. всегда .row > .col-* иначе у Вас будет постоянно ехать верстка да и против правил бутстрапа. В коде явно много таких допущений.

Comments

[squirtazzer]

код делал не я)купил шаблон.

[Aleks Front]

Не в обиду Вам, шаблон скорее всего был сверстан правильно, дальнейшие манипуляции привели к тому что Вы ошибочно изменили его или не правильно раставили блоки. Ну в целом, везде есть документация. За Ваш баг отвечает сетка https://getbootstrap.com/docs/4.0/layout/grid/ посмотрите, там не так сложно + бутстрап имеет широкую аудиторию ( в том числе и видео примеры и статьи как правильно использовать ).

Answer 2

[squirtazzer]

<div class="byblos-contact-form <?php echo isset( $instance['scmod_contact_form_width'] ) ? 'col-sm-' . $instance['scmod_contact_form_width'] : 'col-sm-12'; ?>">

    <div class="widget">
        
        <div class="inner">

            <h2 class="widget-title">
                <?php echo !empty( $instance['scmod_contact_form_title'] ) ? esc_html( $instance['scmod_contact_form_title'] ) : ''; ?>
            </h2>

            <div class="byblos-underline"></div>
            
            <div class="detail">
                <?php echo !empty( $instance['scmod_contact_form_detail'] ) ? esc_html( $instance['scmod_contact_form_detail'] ) : ''; ?>
            </div>

            <form action="<?php echo esc_url( admin_url( 'admin-ajax.php' ) ); ?>" id="scmod-contact-form">

                <input type="hidden" class="recipient" name="recipient" value="<?php echo !empty( $instance['scmod_contact_form_recipient_email'] ) ? $instance['scmod_contact_form_recipient_email'] : ''; ?>" />

                <div class="group">
                    <label><?php echo !empty( $instance['scmod_contact_form_from_label'] ) ? esc_html( $instance['scmod_contact_form_from_label'] ) : ''; ?></label>
                    <input type="text" name="name" class="control name"/>
                </div>

                <div class="group">
                    <label><?php echo !empty( $instance['scmod_contact_form_email_label'] ) ? esc_html( $instance['scmod_contact_form_email_label'] ) : ''; ?></label>
                    <input type="text" name="email" class="control email"/>
                </div>

                <div class="group">
                    <label class="message"><?php echo !empty( $instance['scmod_contact_form_message_label'] ) ? esc_html( $instance['scmod_contact_form_message_label'] ) : ''; ?></label>
                    <textarea name="message" class="control message"></textarea>
                </div>

                <input type="submit" class="accent-button" value="<?php echo !empty( $instance['scmod_contact_form_submit_label'] ) ? esc_attr( $instance['scmod_contact_form_submit_label'] ) : ''; ?>"/>
                <div class="subscribe">
        <input style="vertical-align: top;margin: 4px 5px 0px 0px;" type="checkbox" id="subscribeNews" required="" name="subscribe" value="newsletter"><font-size: 8px;" for="subscribeNews">нажимая кнопку отправить я согласен(на) на обработку данных и ознакомлен(а) с <a href="/politika-konfitsintsialnosti/" style="color:#d85904">политикой
            конфиденциальности</a>
    </div>

                <div class="mail-sent"><span class="fa fa-check-circle"></span> <?php _e( 'Email отправлен!', 'byblos' ); ?></div>
                <div class="mail-not-sent"><span class="fa fa-exclamation-circle"></span> <?php _e( 'There has been an error, please check the information you entered and try again.', 'byblos' ); ?></div>

            </form>

        </div>
            
    </div>
    
</div>

это здесь?

Comments

[Aleks Front]

1. Вот тут оберните два этих блока в div.row joxi.ru/DmBRZ8lIwkeWLm 2. Удалите класс .col-sm-12 тут joxi.ru/V2Vv3bDhxX6q62

[Aleks Front]

Но если посмотреть глубже, может и шаблон такой кривой ? ) Так как там везде эта ошибка. Главное правило любой сетки, колонка не может сущестсовать без родительского блока. А там везде размер ( ширина блока ) задается через колонку, но при этом не указывается родитель c классом .row

[squirtazzer]

Aleksandr | netpix.pro: можете прислать код?просто я удалил сол 12 он мне ошибку выдал

[squirtazzer]

Aleksandr | netpix.pro: byblos.smartcatdev.wpengine.com
видимо я накосячил,ибо в демо шаблона все ок.странно я вроде только ксс правил в коде.в остальном только через админку

[Aleks Front]

Код как выслать ? ) Я показал через инспект элемент где надо исправить в html. Доступа к исходникам нету соответственно. По поводу того как раставленно в админки тоже смотреть надо. Т.е. если ставяться два блока горизонтально ( то должен быть .row и каждый блок иметь класс .col-* ).

[squirtazzer]

Aleksandr | netpix.pro: код я так понимаю задается в Contact_Form_Widget_View.php который Я прислал

[Aleks Front]

Посмотрел шаблон ) Улыбнуло. Тест и тест Вообще провальный шаблончик ) Ориентируйтесь на правильно .row > .col и по тихоньку весь шаблон ( блоки которые используете ) правьте. Может выровняете его. Можно Вашу проблему решить методом костыля который использует шаблон у блока с сертификатами добавьте класс .col-sm-12 И остальные верните. ВАЖНО! это не правильно и так делать нельзя! Но если Вас устроит такое решение как временное пока не пофиксите все остальное.