lørdag, januar 23, 2021

css tabel design

Daily Rush Debat Programmering css tabel design

  • Forfatter
    Emne
  • #0

    Fatal
    Bruger
    1.052 indlæg
    Offline

    Jeg vil gerne have en tabel med en 1px border rundt om hele tabellen, og første række til at være sorte og resten til at være hvide. Til det har jeg lavet følgende:

    table { border-width: 1px; }
    tr.first { background: black;}
    tr.second { background: white; }
    p{ color: white; }
    a{ color: grey; }

    Problemet er, at der mellem hver th/td celle i den sorte række, komme en hvid opdeling. Hvordan kan man gøre det så hele rækken inkl. denne lille border også bliver sort?

Viser 6 kommentarer - 1 til 6 (af 6 i alt)
  • Forfatter
    Kommentarer
  • #1

    Holger-IST-
    Bruger
    6.970 indlæg
    Offline

    mener du skal bruge

    border-collapse: collapse;

    btw det er nok en god ide at bruge table header (thead) til første række, hvis du ikke allerede gør. Så skulle det også være nemmere at style imo.

    edit:
    check den property her, ser ud til at denskal sættes på table
    http://www.w3schools.com/Css/pr_tab_border-collapse.asp

    - Holger "A woman drove me to drink and I didn't even have the decency to thank her." - W. C. Fields

    #2

    Fatal
    Bruger
    1.052 indlæg
    Offline

    Havde godt prøvet collapse, men borderen rundt om hele tabellen forsvinder, når jeg bruger den :S

    Jep, jeg bruger allerede table header til den første række af tabellen. Men er th til for at kunne style nemmere? Ved ikke hvorfor man skal bruge th, sådan har jeg bare lært det, men udseendet synes at være den eneste forskel.

    #3

    Fatal
    Bruger
    1.052 indlæg
    Offline

    Næ det virker sku. Det var fordi jeg ikke defineret border-style. Tak for hjælpen

    edit: Nej, nu er de hvide mellemrum tilbage. Har følgende kode nu:

    table { border-width: 1px; border-style: solid; border-color:black border-collapse: collapse;}
    tr.first { background: black;}
    tr.second { background: white; }
    p{ color: white; }
    a{ color: grey; }

    edit2: Jeg er simpelthen en idiot. Tak for hjælpen holger.

    #4

    Holger-IST-
    Bruger
    6.970 indlæg
    Offline

    hehe selv tak… næste gang kan du jo poste selve siden du editere (hvis du kan/vil) så kan man nemmere kigge på det.

    btw Firebug til Firefox eller Chrome er et genialt værktøj til at teste css on the fly.

    Altså du kan f.eks. tilføje nye styles til css klasser, fjerne dem osv og se resultatet direkte i browseren.

    Det er fedt til at teste minde ændringer.

    http://getfirebug.com/

    Hvis du altså ikke kender til det i forvejen

    - Holger "A woman drove me to drink and I didn't even have the decency to thank her." - W. C. Fields

    #5

    hausner
    Moderator
    17.185 indlæg
    Offline

    Firebug er must have til web udvikling

    Planter er fascinerende

    #6

    Holger-IST-
    Bruger
    6.970 indlæg
    Offline

    #5:
    yup

    - Holger "A woman drove me to drink and I didn't even have the decency to thank her." - W. C. Fields

Viser 6 kommentarer - 1 til 6 (af 6 i alt)
  • Du skal være logget ind for at kommentere på dette indlæg.