CSS Margin Problems

  • Resolved canu

    (@canu)


    9 years, 6 months ago

    Hi, I’m trying to center align a table in the footer of a website without any success.

    The following code is an example of the code that is being used:

    CSS

    .new-table, th, td {
    background-color: #000000;
    color: #ffffff;
    }

    .new-table {
    margin-left: auto;
    margin-right: auto;
    }

    HTML

    <table class=”new-table”>
    <tbody>
    <tr>
    <th>Header1</th>
    <th>Header2</th>
    <th>Header3</th>
    </tr>
    <tr>
    <td data-th=”Header1″>Link1</td>
    <td data-th=”Header2″>Link2</td>
    <td data-th=”Header3″>Link3</td>
    </tr>
    <tr>
    <td data-th=”Header1″>Link4</td>
    <td data-th=”Header2″>Link5</td>
    <td data-th=”Header3″>Link6</td>
    </tr>
    <tr>
    <td data-th=”Header1″>Link7</td>
    <td data-th=”Header2″>Link8</td>
    <td data-th=”Header3″>Link9</td>
    </tr>
    </tbody>
    </table>

    Is there any reason why the centering doesn’t work in WordPress?

    Any help would be much appreciated….

    Thanks!

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

  • Hi canu
    Can you provide URL of the web???
    Have to take a look on life site.
    Thanks
    Tahoerock

    Thread Starter canu

    (@canu)

    Hi Tahoe Rock,

    The live site is at https://www.islandlivingantigua.com/ and the table is in the footer area of the page.

    Thanks!

    Hi
    put this code to your child theme css

    .rwd-table, th, td {
  text-align: center;
}

    SCREENSHOT

    Here is how it looks like when I do it here
    I hope that it is what you were looking for
    Feel free to ask
    Cheers
    Tahoerock

    Thread Starter canu

    (@canu)

    Hi Tahoe Rock,

    The center alignment of the table is fine but we would like to have the text in the table to remain left aligned if at all possible.
    I’ve also put this out on a WordPress forum as well just in case there is something different about applying this code on a WordPress website.

    Regards,
    canu

    Hi canu
    Im not sure what you want.
    So here is second suggestion
    Hoping I fitted your taste. ??

    Change padding-left to any No. px you would like to

    I increased left padding to 61px and it is almost in the centre

    .rwd-table, th, td {
  padding-left: 61px;
}

    Here is a GIF link
    So you can see how the tables are moved with left padding.

    Cheers
    TahoeRock

    Thread Starter canu

    (@canu)

    Hi Tahoe Rock,
    Thanks for your time.
    I’d like the table to be centered in the page but the text in the table to be left aligned.
    I hope that makes sense!
    Unfortunately the GIF link that you’ve given me comes up with the message 403 Forbidden, am I doing something wrong?

    Thanks,
    canu

    Yea you are right:
    GIF is gone, I accidentally deleted it on my site.

    So here is a new GIF

    Thread Starter canu

    (@canu)

    Thanks Tahoe Rock, much appreciated!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘CSS Margin Problems’ is closed to new replies.