[CSS][HTML]Tabele Opcje

[atom90]

Niby trywialny problem, a przyznaje, że mam problem z ostylowaniem komórek

Jak zrobić odstępy między td?
jak zaokrąglić rogi bordera


Co mam:

Jaki Efekt potrzebuje:


Ogolnie to beda dane statystyczne i chyba najlepiej w tabelach je przedstawiać?

Fragment:


Jakieś porady?

Ten post edytował atom90 18.03.2016, 12:27:54

[motyl-pl]

Odstępy:

[HTML] pobierz, plaintext 
table { 
    border-collapse: separate; 
    border-spacing: 0 10px; 
    margin-top: -10px; /* correct offset on first border spacing if desired */
}
td {
    border: solid 1px #000;
    border-style: solid none;
    padding: 10px;
}
td:first-child {
    border-left-style: solid;
    border-top-left-radius: 10px; 
    border-bottom-left-radius: 10px;
}
td:last-child {
    border-right-style: solid;
    border-bottom-right-radius: 10px; 
    border-top-right-radius: 10px; 
}
[HTML] pobierz, plaintext 

[trueblue]

https://jsfiddle.net/n93zbsz1/

[atom90]

dzięki motyl!

lekko zmodyfikowałem pod swój sposob bo nie działało tak jak trzeba. z faktu, ze wszystkie td, chce aby były

Kod

table {
        border-collapse: separate;
        border-spacing: 10px 10px;
      
    }
    td {
        border: solid 1px #f0f2f3;
        border-style: solid none;
        padding: 10px;
    }
    td{
        border-left-style: solid;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
    }
    td {
        border-right-style: solid;
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
    }

Kwestia tylko gdy mam tabelke lewa kolumna i prawa, czy np zrobic jeden td i poprostu te z prawej zrobic float right, niż robić 2 komórki.
bo one wtedy są całe ciągiem, troche inaczej niż w wypadku jak są np te 3.

Co myślicie jakie lepsze rozwiązanie?