اضافه کردن یک المان درون div

[e_a_23]

116763

در این فرم من می خوام یک آیکون کوچک در گوشه سمت راست و بالا بذارم. اما هرکاری می کنم دکمه جستجو پایین می ره و از فرم خارج می شه. راهی دارم که بدون افزایش طول کل فرم این کارو انجام بدم؟(آیکون آبی در تصویر/ اسم این عکس: hotelIcon)



<div class="ReserveForm">

<table style="margin-right: 30px;" cellpadding="0" cellspacing="4">

<th>

رزرو هتل
<img src="Images/hotel-icon.png" title="hotel-icon" class="hotelIcon" />

</th>
<tr>
<td class="labels">
شهر
</td>
<td style="margin-right: 10px" class="select">
<select class="mySelect" name="city">
<option value="tehran" selected="selected">تهران</option>
<option value="mashhad">مشهد</option>
<option value="kish">کیش</option>
</select>
</td>
</tr>
<tr>
<td class="labels">
هتل
</td>
<td style="margin-right: 10px" class="select">
<select class="mySelect" name="city">
<option value="tehran" selected="selected">استقلال</option>
<option value="mashhad">قصر</option>
<option value="kish">داریوش</option>
</select>
</td>
</tr>
<tr>
<td class="labels">
تاریخ ورود
</td>
<td class="txtcheckin">
<input type="text" id="txtIn" name="checkIn" />
</td>
<td>
<a href="#">
<img src="Images/calendar.png" class="calendar" title="calendar" /></a>
</td>
</tr>
<tr>
<td class="labels">
تعداد شب
</td>
<td style="margin-right: -24px;" class="select">
<select class="mySelect" name="city">
<option value="1" selected="selected">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</td>
</tr>
<tr>
<td class="button" colspan="2">
<input type="button" id="btn_search" value="جستجو" />
</td>
</tr>
</table>
</div>



.ReserveForm
{
width: 280px;
height: 260px;
float: right;
background: url("../Images/bg-form.jpg") repeat-x;
margin-top: 21px;
margin-right: 35px;
}
table
{
float: right;
}
.ReserveForm table th
{
text-align: center;
margin-top: 20px;
font: 14px tahoma;
font-weight: bold;
color: #333;
padding-top: 8px;
}

.hotelIcon
{
float:right;


}

[mikrob]

با سلام دوست عزیز
باید استایل آیکونت مقدار position رو absolute بدی و
بعد با margin مکانش رو مشخص کنی .

[e_a_23]

جز این، راه دیگه ای وجود نداره؟ آخه با کوچک و بزرگ کردن پنجره ی مرورگر، مکان این آیکون هم تغییر می کنه.

[e_a_23]

دوستان لطفا کمکم کنید. هیچ راه دیگه ای وجود نداره؟

[colors]

جواب دوستمون درسته ولی شما کل صفحه رو با تصویرهاش بزاری تا ما تغییر بدیم. کدهای که گذاشتی استایل رو نمیده

[e_a_23]

خودم جواب رو پیدا کردم. باید به div والد position:relative داد و بعد به div فرزند position:absolute داد و با top و right,... تنظیمش کرد. با absolute به تنهایی صحیح نیست. در اینجا والد همون کل فرم هست و فرزند هم که همون آیک.ن مورد نظر هست.

[qartalonline]

به جای th از tr استفاده کنید و داخلش دوتا th قرار بدید تو محتوای یکی عکس مورد نظر تون رو بذارید و تو محتوای دیگری عنوان فرم.

[e_a_23]

به جای th از tr استفاده کنید و داخلش دوتا th قرار بدید تو محتوای یکی عکس مورد نظر تون رو بذارید و تو محتوای دیگری عنوان فرم.
کاری که من انجام دادم بهتره یا روش شما؟ یا فرقی نداره؟

[qartalonline]

اگه از روشی که من گفتم جواب گرفتید بهتره از اون استفاده کنید.