خرید بک لینک

درباره سایت

CodingForums

آخرین مطالب

امکانات وب

CSS for table from WordPress Site

I am recreating a website I previously created using a different WordPress theme. In trying to restyle the tables as before I am having a problem getting the styles to apply.

While I could likely use in-line CSS, I would rather add the working CSS to the child-theme css file because more than one page will use a table with this styling.

What it looks like is found here: Ultimate Bridal Party | The Parlour, Inc.
What I want it to look like is found here: Ultimate Bridal Party - The Parlour Inc

When using the inspection tool from the new site, it seems my styles are being overwritten by the following:

.entry-content tr th
.entry-content table

The table I'm trying to style is (I don't know why the class "style-1" is in there - not sure where it originated. However, when I remove it nothing happens. I'll likely remove it permanently):

Code:
<table class="style-1">
<tbody>
<tr>
<th>Bridal Party</th>
</tr>
<tr>
<td class="double-header">$120 per guest</td>
</tr>
<tr>
<td>Hair</td>
</tr>
<tr>
<td>Makeup</td>
</tr>
<tr>
<td>Paraffin Dip</td>
</tr>
<tr>
<td>Beverages</td>
</tr>
<tr>
<td>Breakfast</td>
</tr>
<tr>
<td class="double-header">$200 Deposit</td>
</tr>
<tr>
<td>20% Discount</td>
</tr>
<tr>
<td>Free Bridal Party gift wrapping of The Parlour products</td>
</tr>
</tbody>
</table>
I've tried a variety of combinations for the rule, but I'm missing the mark. Currently, I have it as follows:

Code:
/* Services Pricing Tables*/
.entry-content table {
        border: none;
}

.entry-content table th {
        background-color: #9f877a;
        color: #fff9f0;
        text-align: center;
        font-size: 16px;
        font-weight: bold;
        text-transform: uppercase;
        padding: 13px 0;
}

.entry-content table td {
        padding: 15px 0px;
        border-bottom: 1px solid #e5e5e5;
        font-size: 14px;
        text-align: center;
        color: #808080;
        background: transparent !important;
}

.entry-content table {
        text-align: center !important;
}

table.double-header.entry-content {
        background-color: #944354 !important;
        color: #ffffff !important;
}
What and where am I going wrong? I appreciate your help, thank you!

برچسب: نویسنده: آیلین رضوانی تاريخ: يکشنبه 1 بهمن 1396 ساعت: 12:51

صفحه بندی

آرشیو مطالب

پيوندهای روزانه

لینک دوستان

خبرنامه