Html 调整元件的位置

我正在为一个网站创建一个联系人页面。我想把“社交媒体”的小按钮移到邮箱的正下方，但我想不出来。 任何帮助都将不胜感激，谢谢

下面是我的CSS和HTML：

body{
字体系列：“Raleway”，无衬线；
背景：url（“../images/example.jpg”）；
背景重复：无重复；
背景位置：中心；
背景附件：固定；
背景尺寸：封面；
}
表格{
最大宽度：420px；
利润率：200px自动；
}
.反馈输入{
颜色：白色；
字体系列：“Avenir”，Arial，无衬线；
/*字号：500*/
字号：18px；
边界半径：5px；
线高：22px；
背景色：透明；
边框：2px实心#ffe6f0；
过渡：均为0.3秒；
填充：13px；
边缘底部：15px；
宽度：100%；
框大小：边框框；
大纲：0；
}
.反馈输入：焦点{border:2px solid 35; ff3385；}
文本区{
高度：150像素；
线高：150%；
调整大小：垂直；
}
[type=“submit”]{
字体系列：Arial、Helvetica、无衬线字体；
宽度：100%；
背景#ffe6f0；
边界半径：5px；
边界：0；
光标：指针；
颜色：#555；
字体大小：24px；
填充顶部：10px；
垫底：10px；
过渡：均为0.3秒；
利润上限：-4px；
字号：700；
}
[type=“submit”]：悬停{背景：#ff3385；颜色：白色；}
/*社交的*/
.包装纸{
填充：20px；
文本对齐：居中；
}
.盒子{
显示：内联块；
顶部：10px；
宽度：50px；
高度：50px；
/*更改应用程序之间的距离*/
利润率：0px 19px；
线高：50px；
字体系列：“Avenir”；
字号：28px；
文本对齐：居中；
颜色：#555；
边界半径：10px；
背景：#eee；
溢出：隐藏；
光标：指针；
过渡时间：.30s；
}
.box:悬停{
过渡时间：.30s；
颜色：白色；
}
#facebook：悬停{
背景色：#3a5795；
}
#insta:悬停{
背景色：#c32594；
}
#维梅奥：悬停{
背景色：#00adee；
}
#linkedin：悬停{
背景色：#007bb6；
}
#tumblr:悬停{
背景色：#314358；
}
/*导航条*/
/*按钮的样式*/
.dropbtn{
背景色：rgba（255255,0）；
颜色：白色；
/*保证金：0自动*/
字体大小：16px；
边界：无；
光标：指针；
}
/*控制菜单内容位置的div*/
.下拉列表{
位置：固定；
左：0；
排名：0；
显示：内联块；
}
/*下拉内容*/
.下拉内容{
/*字体系列：*/
显示：无；
/*右：0*/
背景色：#f9f9f9；
最大宽度：150px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
z指数：1；
}
/*下拉列表中的链接*/
.下拉内容a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
}
/*更改悬停时链接的颜色*/
.下拉内容a:悬停{背景色：#ffe6f0}
/*悬停时显示菜单*/
.下拉：悬停.下拉内容{
显示：块；
}
.下拉列表：活动。下拉列表内容{
背景色：红色；
}
/*显示内容时更改下拉按钮的背景色*/
.dropdown:悬停.dropbtn{
背景色：#ff3385；
}

示例| |触点
☰

更改

表单的css规则，因为现在它有很大的底部边距（200px）

它必须是：

form { 
  max-width:420px; 
  margin: 200px auto 0 auto;
}