wordpress - 如何制作两列垂直的字段?
问题描述
我添加了代码的不同部分,现在我对保留什么和不保留什么感到困惑。我正在尝试使用 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>
解决方案
您是否只想将短输入字段放在列中,而将长问题放在页面宽度上?如果是,试试这个:
<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>
推荐阅读
- node.js - 没有重载匹配此调用错误(Typescript/Express)
- dynamic - 大型菜单在 laravel 中无法正确显示
- r - 声明一个函数,以便其参数之一确定 while 循环 (R) 的停止条件
- java - Flutter:(位置插件)由于 java sdk 导致的构建问题
- c# - Windows Forms 一直在 Visual Studio 和 Azure DevOps 中检出
- stl - STL 映射对键与向量
- python-sphinx - 如何在 Sphinx 中引用方程
- c# - 如何在 C# 中将范围与 List 一起使用?
- html - 如何处理 SCSS/SASS 中的悬停
- puppeteer - 背景过滤器:在 puppeteer 无头与非无头屏幕截图中模糊呈现不同