0

My problem is that I added foundation rails to my project that is created in ruby ​​on rails and I wanted to create a small table, but this table when I create creates a white background, what I want to do is make my table transparent without Background of no color.

I tried to put a class and assigning properties but it does not work, also add the style directly, delete the cookies just in case but still does not change color, only resize.

enter image description here

file .css

.tabla {
    width:80%;
    height: 80%;
    background-color:transparent;
}

file .html.erb

<table border="2"  class="tabla">
  <tr>
    <td>Film Affinity</td>
    <td><%= image_tag "film_affinity.png",:class=>"imagenPie"%></td>
  </tr>
    <tr>
    <td>IMDB</td>
    <td><%= image_tag "imdb.png",:class=>"imagenPie"%></td>
  </tr>
    <tr>
    <td>Sensa Cine</td>
    <td><%= image_tag "sensacine.png",:class=>"imagenPie"%></td>
  </tr>

</table>
David
  • 347
  • 1
  • 3
  • 17

2 Answers2

0

It seems ok to me. Perhaps there is some other rules that are overriding your .tabla css. You may try to add an !important and see if that fixes it:

.tabla {
  width:80%;
  height: 80%;
  background-color: transparent !important;
}

Otherwise, the color may come with the td or tr instead from the table. In that case, add the following rule:

.tabla tr, .tabla td {
  background-color: transparent;
}

Note that using !important is usually a bad practice. Try to search and clean your css code instead of using that clause.

Also, the border attribute of tables is deprecated now. You should use border css property instead.

Community
  • 1
  • 1
Wikiti
  • 1,626
  • 13
  • 21
0

By default Foundation sets the background color using the selectors: table thead, table tbody, table tfoot and table tbody tr:nth-child(even) for every other row.

https://github.com/zurb/foundation-rails/blob/master/vendor/assets/scss/components/_table.scss

The following CSS should set all rows to have a transparent background color:

table tbody tr:nth-child(even), table tbody {
    background-color:transparent;
}
Kasper Hesthaven
  • 39
  • 1
  • 5