Removing table cell borders CSS

Question

I'm making an events calendar on a website for a class. The top row of the calendar is the days of the week and the next 4 are the calendar days. The calendar day cells have borders but the days of the week in row one do not. I can't figure out how to get rid of the borders in the 1st row. I tried changing the border color. I tried border="0px" in various places. Can anyone help?

I'm new at HTML and CSS so if you need any information let me know.

try adding tr:first-child td {border: 0} at the end of your css-file — hugo der hungrige
– hugo der hungrige, Commented Nov 10, 2013 at 5:54

Ravi Hamsa · Accepted Answer · 2013-11-10 06:06:15Z

I guess this is what your are looking for. Idea is to have same color as th background and border.

jsffiddle

table { border-collapse: collapse; } th, td { padding:5px; } td,th { border:1px solid #ccc; } th { background-color:#333; border:1px solid #333; color:#fff; }

Ram Patra · Accepted Answer · 2013-11-10 05:58:12Z

0

You can try the border-collapse:collapse; property like

tr:first-child td,tr:first-child th { border-collapse:collapse; }

See this link for better understanding.

answered Nov 10, 2013 at 5:58

Ram Patra

16.7k13 gold badges71 silver badges87 bronze badges

1 Comment

Roko C. Buljan Over a year ago

Or if you feel professional enough and you want an indepth understanding and you care for your knowledge - just read from here: developer.mozilla.org/en-US/docs/Web/CSS/border-collapse

Collectives™ on Stack Overflow

Removing table cell borders CSS

2 Answers 2

Comments

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Related