[CSS, JQuery] DIVy v buňkách tabulky bez mezer

Webdesign, HTML, CSS, Flash, PHP, ASP, .NET, JavaScript. Kritika www stránek na Smetišti.

Moderátor: Moderátoři Živě.cz

Odeslat příspěvekod nofire 24. 3. 2019 15:53

Ahoj, můžete mi prosím někdo poradit ?

Dělám rezervační program a řeším jak zobrazit obsazené dny. Lépe řečeno řeším jejich vzhled. Vykreslím tabulku, kdy v každý buňce je DIV, kterýmu potom měním barvu podle stavu rezervace. To je v pohodě, ale dělám tomu okraj a potřebuju aby byly ty DIVy spojený v jeden přes buňky tabulky. Všechny bordery jsou na nule a pořád mají ty DIVy mezi sebou malou mezeru (viz obrázek v příloze). Není nějaký fígl jak ty DIVy spojit dohromady ? Dělat colspan v tabulce moc nemůžu. Barvu a ohraničení DIVu dělám v javascriptu. Nevěděl byste někdo co s tím ?

Díky

Ve stylech to vypadá takhle:
Kód: Vybrat vše
.obalka {
    border-bottom: 3px solid black;
    border-top: 3px solid black;

}
.okrajZacatek {
    border-bottom: 3px solid black;
    border-top: 3px solid black;
    border-left: 3px solid black;
}
.okrajKonec {
    border-right: 3px solid black;
}

table.hotel {
        width:1100px;
      font-family: Verdana;
      font-size:12px;
      font-weight:normal;
      color:#333333;
      border-collapse: collapse;
   }
   
table.hotel td {
   width:32px;
    height:35px;
    text-align:center;
    vertical-align:middle;
   }

.pole {
    width:100%;
    height:100%;
}


V javascriptu nastavuju barvu a pod potom takhle:
Kód: Vybrat vše
for (i = 0; i < dr.length; i++) {
        if (i == 0) { $('#' + dr[i]).addClass("okrajZacatek")};
        if (hr[i] != hr[i - 1]) {
           $('#' + dr[i]).addClass("okrajZacatek")
        }
        if (hr[i] != hr[i + 1]) {
            $('#' + dr[i]).addClass("okrajKonec");
        }
        $('#' + dr[i]).css('border-top', '3px solid black');
        $('#' + dr[i]).css('border-bottom', '3px solid black');
        $('#' + dr[i]).css('background-color', cr[i]);
}
   
Přílohy
tab.jpg
tab.jpg (27.64 ) Zobrazeno 1584 krát
Ve víně je pravda... ale ve kterém ? Stále ho hledám.
nofire
Junior
Uživatelský avatar

Odeslat příspěvekod Just_jo 25. 3. 2019 18:56

Tak jediné co zbývá je border-spacing.
Jinak padding a margin u TD
Just_jo
Junior
Uživatelský avatar

Odeslat příspěvekod nofire 26. 3. 2019 09:19

Díky, zkusím spacing, to mě nenapadlo.
Ve víně je pravda... ale ve kterém ? Stále ho hledám.
nofire
Junior
Uživatelský avatar

Odeslat příspěvekod jircas 27. 3. 2019 17:48

nebo zkontrolovat box-sizing u divu
jircas
Kolemjdoucí


Kdo je online

Uživatelé procházející toto fórum: Žádní registrovaní uživatelé a 0 návštevníků