Question

I am a newbie to html5 and developing some standalone html5 pages along with their respective css for styling. My question that follows could be a very basic one but somehow after a lot of searching for solutions I decided to post my problem here with a hope to get some hints/advice.

Here goes my problem. I have a standalone html page with its css. when I open the webpage locally on my machine all the css settings are perfectly applied. Then I upload it on my dreamhost server and after the upload when I try to open the page I lose all the formatting that I have done on the tables used in the page, whereas all the other formatting looks good. The formatting goes off on the browser as well as on android webviews. I am not sure what the problem here is in regards to the rules not being applied when I upload files on the server.

Following is how I am using the table in the html page :

<!-- Article 1 start -->

            <div class="line"></div>  <!-- Dividing line -->

            <article id="article1"> <!-- The new article tag. The id is supplied so it can be scrolled into view. -->
                <h3>Comparison Symbols</h3>

                <div class="line"></div>

                <div class="articleBody clear">

                <p> If you’re writing programs in C, you need to use comparison symbols. The symbols C uses, their meanings, and examples are shown in the following table: </p>
                <p>
                    <table>
                              <tr>
                                <th>Symbol</th> 
                                <th>Meaning</th>
                                <th>Examples</th>
                              </tr>

                              <tr>
                                <td></td>
                                <td></td>
                              </tr>

                              <tr>
                                <td> < </td>
                                <td>Less than</td>
                                <td>2 < 6</td>
                              </tr>

                              <tr>
                                <td>==</td>
                                <td>Equal to</td>
                                <td>5 == 5</td>
                              </tr>

                              <tr>
                                <td>></td>
                                <td>Greater than</td>
                                <td>8 > 5</td>
                              </tr>

                              <tr>
                                <td><=</td>
                                <td>Less than or equal to</td>
                                <td>4 <= 5</td>
                              </tr>

                              <tr>
                                <td>>=</td>
                                <td>Greater than or equal to</td>
                                <td>9 >= 5</td>
                              </tr>

                              <tr>
                                <td>!=</td>
                                <td>Not equal to</td>
                                <td>1 != 0</td>
                              </tr>
                    </table>            
                </p>
                </div>
            </article>

And following is the lines of code that I have used in the css for the table formatting :

/* table properties */

th {width:150px;
    text-align:left;
    font-weight:bold;
    text-decoration: underline;}
td {text-align:left}

It would be a great help if someone could give some advice.

Answer 1

The css file on the server was reverting back to an older version. The problem was solved when the reverting solved and the css retained the following config :

th {width:150px;
text-align:left;
font-weight:bold;
text-decoration: underline;}
td {text-align:left}