I am looking to rotate the header table using CSS while keeping all text together. Here is my CSS code:
th.rotate {
height: 100px;
white-space: nowrap;
}
th.rotate>div {
transform: rotate(-90deg);
}Here is how I have applied this CSS:
<th class="rotate"><div>Tintoria</div></th>
<th class="rotate"><div>Mag.Tops</div></th>
<th class="rotate"><div>Mag.Filati</div></th> <th class="rotate"><div>Orditura</div></th>
<th class="rotate"><div>Tessitura</div></th>
<th class="rotate"><div>Ramm./Contr.</div></th>After implementing this code, the result is shown below:
My question is: How can I reduce all spaces between buttons to 0?
Here is an example image of my goal: enter image description here