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

  • DavidParody

    DavidParody

    17 EKİM 2009
  • krotoflik

    krotoflik

    26 ŞUBAT 2011
  • KSI

    KSI

    25 Temmuz 2009