The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Responsive Table, img not centered smartphone

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #199753

    I am using modified code from this link:

    It works well except for a table of images in the footer (BBB and Paypal images at
    I’ve tried all sorts of CSS to center the images. I had to remove the padding left because the images were right aligned. But now they are left aligned and not centered.
    I don’t know if this is because the table has no “th” row and if possible, I’d appreciate and explanation of the td: vs td:before and how that might be affecting the outcome. This table was basically a single row table with no header.



    Hi, Jeff,

    You have the following from the css-tricks article:

    td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;

    By setting position:absolute and left:6px, you are forcing your table elements to show up 6 pixels from the left of their container. In the tutorial, this is what he wants: he uses padding-left:50% on the td to make the content start at the center, and pushes the title in on the left with absolute positioning. You don’t want that.

    If that’s not enough to make things clear, create a codepen with just the bottom table, and I’ll edit it to fix the problem.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.