Tank Avcısı içindeki bir DIV kötü bir fikir midir?

Ben duydum gibi / a okumuştum görünüyor <div>bir iç <td>no-hayır oldu. Bu işe yaramaz, sadece ekran türlerine göre gerçekten uyumlu olmamaları hakkında bir şey. Yığımı destekleyecek hiçbir kanıt bulamıyorum, bu yüzden tamamen yanlış olabilirim.

Bir divinstide a tdkullanmak, tabloları mizanpaj için kullanmanın diğer bir yolundan daha kötü değildir. (Bazı insanlar düzen için tabloları asla kullanmazlar ve ben de onlardan biri olurum.)

Eğer bir kullanırsanız divbir de tdsen ancak unsurlar büyüklükte nasıl tahmin etmek zor olabilir bir durumda olacaktır. Bir div için varsayılan, üst öğesinden genişliğini belirlemektir ve bir tablo hücresi için varsayılan, içeriğinin boyutuna bağlı olarak boyutunu belirlemektir.

A'nın nasıl divboyutlandırılacağına ilişkin kurallar standartlarda iyi tanımlanmıştır, ancak a'nın nasıl tdboyutlandırılacağına ilişkin kurallar iyi tanımlanmamıştır, bu nedenle farklı tarayıcılar biraz farklı algoritmalar kullanır.

XHTML DTD'yi kontrol ettikten sonra, <TD> öğesinin başlık, liste ve ayrıca <DIV> öğesi gibi blok öğeleri içermesine izin verildiğini keşfettim. Bu nedenle, <TD> öğesinin içinde bir <DIV> öğesinin kullanılması XHTML standardını ihlal etmez. Diğer modern HTML varyasyonlarının <TD> öğesi için eşdeğer bir içerik modeline sahip olduğundan eminim.

İlgili DTD kuralları şunlardır:

<!ELEMENT td %Flow;>
<!-- %Flow; mixes block and inline and is used for list items etc. -->
<!ENTITY %Flow "(#PCDATA | %block; | form | %inline; | %misc;>
<!ENTITY %block "p | %heading; | div | %lists; | %blocktext; | fieldset | table">

Hayır.

TD içine bir DIV yerleştirmeniz gerekirse, TD'yi doğru kullandığınızdan emin olun. Sekmeli veriler ve anlambilim ile ilgilenmiyorsanız, sonuçta TD'lerde DIV'leri umursamazsınız. Eğer - Bir sorun olsa var sanmıyorum var size, bunu yapmak için sen öyle giyin.

HTML Spesifikasyonuna Göre

A <div>, akış içeriği beklendiği yere yerleştirilebilir ¹ , yani <td>içerik modeli ² .

Bir tablo hücresi meşru bir şekilde blok düzeyinde öğeler içerebilir, bu yüzden doğal olarak bir sahte-pas değildir. Tarayıcı implentasyonu, elbette, bunu spekülatif-teorik bir pozisyon bırakır. Düzen sorunlarına ve hatalara neden olabilir.

Tablolar mizanpaj için kullanıldıkça -ve bazen de hala- çoğu tarayıcının içeriği düzgün bir şekilde oluşturacağını hayal ediyorum. IE bile.

Pozisyon kullanmak istiyorsanız: mutlak; div ile position: relative;td üzerinde sorunları karşılaşacaksınız. FF, safari ve krom (mac değil, PC değil) div'i td'ye göre konumlandırmayacak (beklediğiniz gibi) bu da div'ler için geçerlidir, display: table-whatever;eğer bunu yapmak istiyorsanız iki div'e ihtiyacınız vardır, biri için kap width: 100%; height: 100%;ve sınır yok, böylece td'yi herhangi bir görsel etki olmadan doldurur. ve sonra mutlak olanı.

bunun dışında neden sadece hücreyi bölmüyorsunuz?

<div>İçine yerleştirerek sorunla karşılaştım <td>.

document.getElementById()Eğer td içine yerleştirirseniz div tanımlayamadı . Ama dışarıda, iyi çalışıyordu.

Herkesin de belirttiği gibi, yerleşim amaçları için iyi bir fikir olmayabilir. Ben bu soruyu geldi çünkü aynı merak ediyorum ve sadece geçerli kod olup olmadığını bilmek istedim.

Geçerli olduğundan, başka amaçlar için kullanabilirsiniz. Örneğin, bunun için kullanacağım, tablo satırlarının içine bazı "CSSed" div'ler koymak ve daha sonra kullanıcının bilgileri fiyat, isim vb. sadece düzen tablo bana verecek "dikey sipariş", ama ben CSS tarafından div genişliği, yüksekliği, arka plan, vb kontrol edeceğim.

Bununla baş etmenin iki yolu

1. etiketin diviçine koytbody
2. etiketin diviçine koytr

Eğer arzu görürseniz, her iki yaklaşım da geçerlidir: https://stackoverflow.com/a/23440419/2305243

Bu kırar semantiğini hepsi bu. İyi çalışıyor, ancak "anlambilimi bozarsanız" ekran okuyucular veya HTML'nizi işlemekten zevk almayacak bir şey olabilir.