制作与右对齐一个形式和风格

-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

制作与右对齐一个形式和风格

回答

相关问题