Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Problems importing To Excel a HTML file With Multiple Css Classes On Elements

Tags:

css

excel

Excel looks that it does not understand the HTML attribute 'class' if several CSS classes are pointed for HTML element.

For example if "class='A B'" pointed to tag 'TD' Excel will use empty style for the tag.

I have these html code:

<style type="text/css">
TABLE.t1_table{
background-color:#828a3c;
border:solid 1px #3A6EA5;
padding-left:2px;
padding-top:2px;
padding-right:2px;
padding-bottom:2px;
font-style:italic;
font-variant:small-caps;
font-size:20px;
color:#6b3f07;
border-collapse:collapse;   

}

TR.t1_ph TD{
background-color:#B0C4DE;
border:solid 1px #3A6EA5;
padding-right:6px;
font-weight:bold;
color:#3A6EA5;  

}

TR.t1_co TD{
background-color:#103a70;
border:solid 1px #3A6EA5;
padding-right:6px;  

}

</style>

<table class="t1_table" cellpadding="" cellspacing="">
<tr class="t1_ph"><td colspan="1">Age</td></tr>
<tr class="t1_co"><td style="background-color:#cb7878">45</td></tr>
<tr class="t1_co"><td>23</td></tr>
</table>

If I open the file in IE, then I can see correctly. If I open the file in MS Excel, then I see wrong.

It this a a known problem in Office?

Does anyone have any experience with this issue?

Thanks.

like image 473
SergioKastro Avatar asked Nov 14 '22 03:11

SergioKastro


1 Answers

Excell is not an internet browser and do not expect it to parse css, it will use only element containing classes, so you need to use this kind of code:

<style type="text/css">
.t1_table {
    background-color:#828a3c;
    border:solid 1px #3A6EA5;
    padding-left:2px;
    padding-top:2px;
    padding-right:2px;
    padding-bottom:2px;
    font-style:italic;
    font-variant:small-caps;
    font-size:20px;
    color:#6b3f07;
    border-collapse:collapse;   
}

.t1_ph {
    background-color:green;
    border:solid 1px #3A6EA5;
    padding-right:6px;
    font-weight:bold;
    color:#3A6EA5;  
}

.t1_co {
    background-color:red;
    border:solid 1px #3A6EA5;
    padding-right:6px;  

}

</style>

<table class="t1_table" cellpadding="" cellspacing="">
    <tr><td class="t1_ph">Age</td></tr>
    <tr><td class="t1_co" style="background-color:#cb7878">45</td></tr>
    <tr><td class="t1_co">23</td></tr>
</table>

This is also good, because sometimes you need to define Excell cell-type and you can use following formats: http://cosicimiento.blogspot.co.at/2008/11/styling-excel-cells-with-mso-number.html

like image 77
skobaljic Avatar answered Dec 29 '22 11:12

skobaljic