Removing coloured border from Table

Resolved UrsulaD
(@ursulad)

11 years ago

Hi Guys,

I have tried using the codes mentioned in earlier posts to remove coloured border from table but its not working for me.

table.home{
border: none;
background-color: #FAFAFA;
}

and also

table.page-id-1098 {
border: none;
background-color: #FAFAFA;
}

Please help http://www.foodandbeveragetrainer.com/mystery-guest/

Viewing 10 replies - 1 through 10 (of 10 total)

rdellconsulting
(@rdellconsulting)

11 years ago
Try
```
table.page-id-489 {
border-bottom: none;
}
```
Red Deer Web Design
(@bdbolin)

11 years ago
```
table {
border: none;
}

or 

table {
border: none !important;
}
```
!important is like a super override so use sparingly.
rdellconsulting
(@rdellconsulting)

11 years ago
If only table on site, try:
```
table {
border-bottom: none;
}
```
Thread Starter UrsulaD
(@ursulad)

11 years ago

Hi rdell and Red Deer I tried all of the options you gave me but its still there 🙁

I am putting the codes in the CSS editor.
rdellconsulting
(@rdellconsulting)

11 years ago
Here’s the code being picked up:
```
table {
    border-bottom: 5px solid rgba(247, 140, 64, 0.5);
    border-collapse: collapse;
    border-spacing: 0px;
    font-size: 14px;
    line-height: 2;
    margin: 0px 0px 20px;
    width: 100%;
}
```
In the border-bottom, change 5px to 10px and see if anything changes. Should work in CustomCSS panel.

Then try
```
table {
border-bottom: none; !important
}
```
Thread Starter UrsulaD
(@ursulad)

11 years ago

I am not sure why non of these are working for me.
I also changed it from 5px to 10px and even 0px but nothing happened.

This is the table html code I have used.

<table style=”height: 385px;” width=”806″>
<tbody>
<tr>
<td><img class=”aligncenter wp-image-940″ src=”http://www.foodandbeveragetrainer.com/wp-content/uploads/2015/04/L1159434-250×168.jpg” alt=”Mystery Guest ” width=”230″ height=”155″ />
<h3 style=”text-align: center;”>Food and Beverage</h3>
<div style=”text-align: center;”>Restaurants</div>
<div style=”text-align: center;”>Bars & Lounges</div>
<div style=”text-align: center;”>Room Service</div>
<div style=”text-align: center;”>Pool and Beach Service
Back of House</div>
<div style=”text-align: center;”></div></td>
<td><img class=”aligncenter wp-image-950″ src=”http://www.foodandbeveragetrainer.com/wp-content/uploads/2015/04/Guest-Service-250×167.jpg” alt=”Mystery Guest” width=”233″ height=”155″ />
<h3 style=”text-align: center;”>Guest Services</h3>
<div style=”text-align: center;”>Arrival & Check-in Experience</div>
<div style=”text-align: center;”>Concierge</div>
<div style=”text-align: center;”>Guest Relations</div>
<div style=”text-align: center;”>Switchboard</div>
<div style=”text-align: center;”>Spa & Fitness Centre</div>
<div style=”text-align: center;”></div></td>
<td><img class=”aligncenter wp-image-947″ src=”http://www.foodandbeveragetrainer.com/wp-content/uploads/2015/04/Hill-Rock-Villa-Bedroom-250×155.jpg” alt=”Mystery Guest ” width=”250″ height=”155″ />
<h3 style=”text-align: center;”>Rooms</h3>
<div style=”text-align: center;”>Arrival & Daily Cleanliness</div>
<div style=”text-align: center;”>Turndown Service</div>
<div style=”text-align: center;”>Amenities</div>
<div style=”text-align: center;”>Equipment Maintenance</div>
<div style=”text-align: center;”>Facilities & Furniture Condition</div>
<div style=”text-align: center;”></div></td>
</tr>
</tbody>
</table>

Rocco Aliberti
(@d4z_c0nf)

11 years ago

Something like:
#page-489 table, #page-489 table td { border: none }
doesn’t work?

Red Deer Web Design
(@bdbolin)

11 years ago

Realistically all of these solutions should work. I don’t think your CSS is being read.
Rocco Aliberti
(@d4z_c0nf)

11 years ago
Yes most of the should work indeed.

Anyway that’s the major problem of your custom css:
```
/* push image caption down into border below image */
.jetpack-slideshow .slideshow-slide-caption {
  bottom: -24px;
)
```
As you can see you put a ) where must there be }

Also you have other small typos like putting
!important after ;

For example, a rule like this one:
.gallery IMG{border-style:none;!important}

should be
.gallery IMG{border-style:none !important;}
or at maximum
.gallery IMG{border-style:none !important}

Hope this helps.
Thread Starter UrsulaD
(@ursulad)

11 years ago

Yes it worked. Thanks sooooooo much

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘Removing coloured border from Table’ is closed to new replies.

Tags