正确对齐图像并添加垂直线

Question

使用CSS，我试图在橙色图标和文本字段之间添加一条漂亮而平滑的垂直线。与此同时，我正在尝试正确对齐图标。换句话说，下面的第一张图片是我想要的结果。任何人都可以为我提供指导吗？

我一直在修补代码大约两天但是一次又一次失败了。这是我得到的最好的。实际上，在我变得更糟之前，一个善良的灵魂帮助我达到了这一点。

到目前为止的HTML

<form action="confirmed.php" method="get">
    <div class="divitem" id="name">
        <div class="icon">
            <img width="40" src="http://i.imgur.com/zZE0y3y.png" />
        </div>
        <div class="label">
             <h2>Name</h2>

        </div>
        <div class="field">
            <input type="text" />
        </div>
    </div>
    <div class="divitem" id="desc">
        <div class="icon">
            <img width="40" src="http://i.imgur.com/zZE0y3y.png" />
        </div>
        <div class="label">
             <h2 id="dlabel">Description</h2>

        </div>
        <div class="field">
            <textarea class="field"></textarea>
        </div>
    </div>
    <div class="divitemcntct" id="cntct">
        <div class="icon">
            <img width="40" src="http://i.imgur.com/zZE0y3y.png" />
        </div>
        <div class="label">
             <h2>Email</h2>

        </div>
        <div class="field">
            <input id="mail" type="text" />
        </div>
    </div><span id="or">Or</span>

    <div class="divitemPhone" id="Phone">
        <div class="icon">
            <img width="40" src="http://i.imgur.com/zZE0y3y.png" />
        </div>
        <div class="label">
             <h2>Phone</h2>

        </div>
        <div class="field">
            <input id="phone" type="text" />
        </div>
    </div>
    <div class="divitem" id="desc">
        <br/>
        <br/>
        <input id="sub" type="submit" value="SUBMIT" />
    </div>
</form>

到目前为止的CSS

.divitem {
    padding:10px;
    padding-left:20px;
    background-color:#BFD6F6;
    border-top:1px solid #7C94A0;
    border-bottom:1px solid #7C94A0;
    width:1000px;
    height:100px;
}
.label {
    display:inline;
    width:200px;
    float:left;
    height:100px;
    text-align:center;
}
.icon {
    margin:0px;
    margin-left:-5px;
    padding:0px;
    float:left;
    border-right:1px solid black;
    height:100px;
}
input, textarea {
    position:relative;
    left:143px;
    width:60%;
    height:50px;
    padding:10px;
    background-color:#C6DEFF;
    border:1px solid #7C94A0;
}
#or {
    text-align:center;
    width:1000px;
    display:block;
    font-weight:bold;
    background-color:#BFD6F6;
}
#sub {
    width:80px;
    height:40px;
    left:0px;
    border:1px solid #7C94A0;
    border-radius:5px;
    background-color:#E6E6E6;
    font-weight:bold;
}
.divitemcntct
{
    padding:10px;
    padding-left:20px;
    background-color:#BFD6F6;
    border-top:1px solid #7C94A0;
    width:1000px;
    height:100px;
}
.divitemPhone
{
    padding:10px;
    padding-left:20px;
    background-color:#BFD6F6;
    border-bottom:1px solid #7C94A0;
    width:1000px;
    height:100px;
}