Search code examples
htmlcssiwebkit

Formatting tables in iWebKit using CSS doesn't work


I am setting up a mobile iPhone Intranet site with iWebKit. Most of the things work perfectly, except I cannot get formatting of my table right using CSS.

What I have in my HTML (actually ASP since the HTML is created using queries on a database) is the following:

<div id="content">
   <ul class="pageitem">
      <li class="textbox">
         <table class="mytable">
            <tr>
               <th>Type</th>
               <th>Value1</th>
               <th>Value2</th>
               <th>Value3</th>
               <th>Value4</th>
            </tr>
            <tr>
               <th>First type</th>
               <td>123</td>
               <td>456</td>
               <td>789</td>
               <td class="targetok">159</td>
            </tr>
         </table>
      </li>
   </ul>
</div>

And I've added the following to iWebKit's CSS file:

.mytable {
    border:1px solid black;
    border-collapse:collapse;
    font-family: Helvetica;
    color:#000000;
    font-size:20px;
    width:100%;
    height:35px;
    padding:5px;
    text-align:center;
    -webkit-text-size-adjust:none;
}

.targetok {
    background:#80FF80
}

I've tried several combinations (also adding table, tr, th and/or td to .mytable) but the table never seems to be formatted. It is always shown without borders, small font, not colored, ...

Since I don't know much about CSS I also quickly followed the CSS introduction on W3SCHOOLS. As far as I can see the syntax is correct.

I seem to be missing something, but can't find it. Is something wrong in my syntax? Or does iWebKit prevent you from adding your own CSS rules?


Solution

  • To force refreshing you can use this code:

    <link href="your.css?1" rel="stylesheet" type="text/css" />
    

    ?1

    Where 1 is your version, Safari will retrieve this css because it's like php request.

    Or you can add inline styles in <style></style> tag