SORU
31 Mart 2009, Salı


Div ile HTML Tablo yerine

Tamam, html tabloları kullanılmamalıdır fikri içine almak için çalışıyorum, ve bu divs olmalıdır. Ancak, sık sık aşağıdakine benzer bir kod var

<table>
    <tr>
        <td>First Name:</td>
        <td colspan="2"><input  id="txtFirstName"/></td>
    </tr>
    <tr>
        <td>Last Name:</td>
        <td colspan="2"><input  type="text" id="txtLastName"/></td>
    </tr>
    <tr>
        <td>Address:</td>
        <td>
            <select type="text" id="ddlState">
                <option value="NY">NY</option>
                <option value="CA">CA</option>
            </select>
        </td>
        <td>
            <select type="text" id="ddlCountry">
                <option value="NY">USA</option>
                <option value="CA">CAN</option>
            </select>
        </td>
    </tr>
</table>

Etiketler hizalı olmasını istiyorum ve denetimlere uyumlu olmasını istiyorum. Nasıl tablolar kullanmadan bunu yapabilir miyim?

CEVAP
31 Mart 2009, Salı


Bu işini halleder.

<style>
div.block{
  overflow:hidden;
}
div.block label{
  width:160px;
  display:block;
  float:left;
  text-align:left;
}
div.block .input{
  margin-left:4px;
  float:left;
}
</style>

<div class="block">
  <label>First field</label>
  <input class="input" type="text" id="txtFirstName"/>
</div>
<div class="block">
  <label>Second field</label>
  <input class="input" type="text" id="txtLastName"/>
</div>

Konsepti anlamışsınızdır umarım.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • kremosakhaz

    kremosakhaz

    25 AĞUSTOS 2006
  • LiteralMSPaint

    LiteralMSPai

    27 EKİM 2010
  • LivestrongWoman

    LivestrongWo

    1 Aralık 2011