Decrease vertical gap between two text box

[vikas_gopal]

Hello Everyone,
I have a difficult situation .I am preparing a form where in I have 3 read only text boxes and in front of them I am using textarea to get user input.I want to decrease the vertical gap between these boxes so that it looks like a table.OR any way to touch two text boxes so that bottom border of the upper box will become the top border of the below text box..
My simple XML code

<input type ="text"  id = "vik4" readonly="readonly" value="Application DB"/>
<textarea rows="30" cols="20" id="vik5"   ></textarea>
<input type ="text"  id = "vik6" readonly="readonly" value="Ariba"/>
<textarea rows="30" cols="20" id="vik7"   ></textarea>
<input type ="text"  id = "vik8" readonly="readonly" value="EDW BI"/>
<textarea rows="30" cols="20" id="vik9"   ></textarea>

CSS file

#vik4,#vik6,#vik8,#vik10{
width : 100px;
height :20px;
background-color:white;
color:red;
font-size: 13px;
font-weight: bold;
text-align:center;
border:solid 1px red;
border-radius: 0px;
}

#vik5,#vik7,#vik9{
width : 800px;
height :20px;
background-color:white;
color:black;
font-size: 10px;
border-style:solid;
border-width:2px;
border-radius: 0px;
border:solid 1px black;
}

Please suggest how I can achieve this so that it looks like a table rather as an individual item or boxes.

[vikas_gopal · Accepted solution]

I achieved this with labels .I mean use labels rather than text or text area.

[vikas_gopal]

any suggestion..?