Border Height on CSS

Question

I have a table TD and on the right of it I want to add a 1 pixel border, so I've done this:

table td {     border-right:1px solid #000; } 

It works fine but the problem is that the border's height takes the total TD's height.

Is there a way to set the height of the border?

Answer 1

I have another possibility. This is of course a "newer" technique, but for my projects works sufficient.

It only works if you need one or two borders. I've never done it with 4 borders... and to be honest, I don't know the answer for that yet.

.your-item {   position: relative; }  .your-item:after {   content: '';   height: 100%; //You can change this if you want smaller/bigger borders   width: 1px;    position: absolute;   right: 0;   top: 0; // If you want to set a smaller height and center it, change this value    background-color: #000000; // The color of your border } 

I hope this helps you too, as for me, this is an easy workaround.