製作與右對齊一個形式和風格

-1

不幸的是我似乎無法得到正確的風格和定位。我已經呆了好幾個小時了，無論我採取什麼樣的方式，似乎只會給我帶來垃圾。下面是我最好的代碼，不是很好，但是它是什麼。任何人都可以幫助修復代碼以反映上述圖片嗎？我真的很感激它。

<style> * { 
     -webkit-box-sizing:border-box; 
     box-sizing:border-box; 
    } 
    .group:after { 
     content: ""; 
     display: table; 
     clear: both; 
    } 
    .containerANE { 
    overflow: hidden; 
    background: #C6DEFF; 
    width: 992px; 
    } 

    .rightANE { 
    float: right; 
    width: 30px; 
    outline: 1px solid #8191a6; 
    } 
    .leftANE { 
    float: left; 
    width: 152px; 
    outline: 1px solid #8191a6; 
    } 
    .middleANE { 
    width:717px; 
    outline: 1px solid #8191a6; 
    } 
</style> 


<h1>E-mail US</h1> 
<form action="file:///C:/Users/Owner/Desktop/confirmed.php" method="get"> 
<div class="group containerANE"> 
<div class="group rightANE"> 
<img width="25" src="http://i.imgur.com/881g5D7.png"> 
</div> 
<div class="group leftANE"> 
Name 
</div> 
<div class="group middleANE"> 
<input type="text"> 
</div> 

<div class="group rightANE"> 
<img width="25" src="http://i.imgur.com/881g5D7.png"> 
</div> 
<div class="group leftANE"> 
Description 
</div> 
<div class=middleANE> 
<textarea rows="4" cols="50"> 

</textarea> 
</div> 


<div class=rightANE> 
<img width="25" src="http://i.imgur.com/881g5D7.png"> 
</div> 
<div class=leftANE> 
E-mail<br><br>Phone 
</div> 
<div class=middleANE> 
<input type="text"> 
<br> OR <BR> 
<input type="text"> 
</div> 
<input type="submit" value="SUBMIT">

This is a representation of the code in JSFiddle.

來源

2014-01-20 RJay

首先...歡迎來到堆棧溢出....你現在可以顯示你正在得到什麼？ –

你的具體問題到底是什麼？您的代碼距離該圖像非常近 - 您是否可以縮小特定問題的範圍？除此之外，「看起來不一樣，請讓它看起來一樣。」 – 2014-01-20 03:11:10

謝謝！這是我現在正在獲取http://i.imgur.com/WZ8iy3c.jpg – RJay

這FIDDLE會給你一個開始。

HTML

<table class='holder'> 
    <tr> 
     <td>Name:</td> 
     <td><input type='text' size=40></input></td> 
     <td><div class='icondiv'></div></td> 
    </tr> 
    <tr> 
     <td>Desscription:</td> 
     <td><textarea rows=6 cols=31></textarea></td> 
     <td><div class='icondiv'></div></td> 
    </tr> 
    <tr> 
     <td>Email:</td> 
     <td><input type='text' size=40></input></td> 
     <td></td> 
    </tr> 
    <tr> 
     <td colspan='3' id='single'>or<div id='singlediv' class='icondiv'></div></td> 
    </tr> 
    <tr> 
     <td>Phone:</td> 
     <td><input type='text' size=40></input></td> 
     <td></td> 
    </tr> 
    <tr> 
     <td colspan='3' id='single'><input type='submit'></input></td> 
    </tr> 
</table>

的CSS有點長，這是在任何情況下，小提琴。

與CSS一起玩，根據您的需求進行調整。

來源

2014-01-20 04:02:31 TimSPQR

製作與右對齊一個形式和風格

回答

相關問題