Как сделать два вертикальных столбца полей? - PullRequest
Новая
       10

Как сделать два вертикальных столбца полей?

0 голосов
/ 27 марта 2019

Я добавил другую часть кодов, и теперь я все запутался в том, что оставить, а что нет. Я пытаюсь получить контактную форму с 2 вертикальными столбцами. Могу ли я получить инструкции о том, что добавить / сохранить и удалить? (См. Код ниже). Любая помощь будет принята с благодарностью. 

<div class="clearfix">

<div class>

width:50%;
float:left;

[text* your-name placeholder "*Your full name"] <br/>

[email* your-email placeholder "*Your email"] <br/>
</div>

<div class>

    width:50%;
    float:right;

[tel* your-tel placeholder "*Your phone number"] <br/>

[text* your-zip placeholder "*Your zipcode"] <br/>
    </div>
</div>

<label> What school do you go to? </label><br>
[select* menu include_blank "Alabama School of Fine Arts" "Altamont" "Birmingham-Southern College" "Briarwood Christian School" "Enlightium Academy (Online School)" "Homewood High School" "Hoover High School" "Indian Springs School" "Islamic Academic of Alabama" "Jefferson State Community College" "John Carroll Catolic High School" "Mountain Brook High School" "Oak Mountain High School" "Spain Park High School" "UAB - University of Alabama in Birmingham" "Vestavia Hills High School" "Westminster School" "Other"] </br>

<label> What grade are you in? </label>
[select* menu-2 include_blank "5th grade" "6th grade" "7th grade" "8th grade" "9th grade (Freshman)" "10th grade (Sophomore)" "11th grade (Junior)" "12th grade (Senior)" "College" "Not at school" "Other"] </br>

<label> How can we help you? </label><br>
    [checkbox* checkbox "Conjugation" "Conversation" "Grammar" "Homeworks" "Learn the Basics" "Test Preparation" "Other"] </br>

[text your-message 20x20 placeholder "Additional Comments"]

<div class="row">
<center>[submit "Submit"]</center></div>

1 Ответ

0 голосов
/ 28 марта 2019

Вы хотите, чтобы только короткие поля ввода были в столбцах, а длинные вопросы задавали ширину страницы? Если да, попробуйте это: 

<div class="clearfix">

    <div style="float:left; width:50%;">
        [text* your-name placeholder "*Your full name"] <br/>

        [email* your-email placeholder "*Your email"] <br/>
    </div>

    <div style="float:right; width:50%;">
        [tel* your-tel placeholder "*Your phone number"] <br/>

        [text* your-zip placeholder "*Your zipcode"] <br/>
    </div>

    <div>

        <label> What school do you go to? </label><br>
        [select* menu include_blank "Alabama School of Fine Arts" "Altamont" "Birmingham-Southern College" "Briarwood Christian School" "Enlightium Academy (Online School)" "Homewood High School" "Hoover High School" "Indian Springs School" "Islamic Academic of Alabama" "Jefferson State Community College" "John Carroll Catolic High School" "Mountain Brook High School" "Oak Mountain High School" "Spain Park High School" "UAB - University of Alabama in Birmingham" "Vestavia Hills High School" "Westminster School" "Other"] </br>

        <label> What grade are you in? </label>
        [select* menu-2 include_blank "5th grade" "6th grade" "7th grade" "8th grade" "9th grade (Freshman)" "10th grade (Sophomore)" "11th grade (Junior)" "12th grade (Senior)" "College" "Not at school" "Other"] </br>

        <label> How can we help you? </label><br>
            [checkbox* checkbox "Conjugation" "Conversation" "Grammar" "Homeworks" "Learn the Basics" "Test Preparation" "Other"] </br>

        [text your-message 20x20 placeholder "Additional Comments"]

        <div class="row">
            <center>[submit "Submit"]</center>
        </div>

    </div>

</div>
...