paddingについて

aタグにbackground colorとpaddingで背景の幅を広げたのですが、広げた部分がaタグの前に書いていた、selectのリストとかぶってしまいました。
かぶらないように、広げた分下にずれるようにするにはどのようにしたら良いのでしょうか？？

該当のソースコード

HTML
1<div class="head2-2">
2        	<p>予想ホスティング収入額を更新するにはお部屋についてさらに詳しくお聞かせください</p>
3        	<form action="#" method="post">
4        		<input type="text" name="area">
5        		<select name="roomtype">
6        			<option label="まるまる貸切">ゲストはお部屋をまるまる独り占めできます。専用玄関があり、共有スペースはありません。通常、寝室、バスルーム、キッチンが含まれます。</option>
7        			<option label="個室">就寝時はゲスト専用の個室を利用します。その他のエリアは共用の場合があります。</option>
8        			<option label="シェアルーム">ゲストの寝室は他者と共有する場合のある相部屋または共用エリアとなります。</option>
9        		</select>
10        		<select name="roomman">
11        			<option>ゲスト0</option>
12        			<option>ゲスト1</option>
13        			<option>ゲスト2</option>
14        			<option>ゲスト3</option>
15        			<option>ゲスト4</option>
16        			<option>ゲスト5</option>
17        			<option>ゲスト6</option>
18        			<option>ゲスト7</option>
19        			<option>ゲスト8</option>
20        			<option>ゲスト9</option>
21        			<option>ゲスト10</option>
22        			<option>ゲスト11</option>
23        			<option>ゲスト12</option>
24        			<option>ゲスト13</option>
25        			<option>ゲスト14</option>
26        			<option>ゲスト15</option>
27        		</select>
28        	</form>
29        	<a href="#">リスティングの掲載をはじめる</a>
30        </div>

CSS
1.head2-2 p{
2	font-size: 20px;
3}
4
5.head2-2 a{
6	color: white;
7	padding: 20px;
8	margin-top: 100px;
9	border-radius: 5px;
10	text-decoration: none;
11	background-color: red;
12}