Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • May 26, 2015 at 2:16 am #449773
    greenpomodoro

    Having an alignment issue with my pricing table.

    The column (first column) which is a “description column”, does not line up with the rest of the regular columns. It appears the issue is the content in the regular column has one cell that is two lines long, after that point the alignment issue develops. Please let me know how to fix this issue, other than removing words I need!

    http://thekarmacup.com/sponsorship-packages-2015/

    May 26, 2015 at 5:24 pm #450208
    Elliott

    Hi greenpomodoro!

    Are you wanting to hide the second line? If so then add a codeblock element to the page and paste this inside.

    <style type = "text/css">
.pricing-table li {
  height: 37px;
}
</style>

    Best regards,
    Elliott

    May 26, 2015 at 7:02 pm #450273
    greenpomodoro

    No.

    I would like to have all the rows in all the columns actually lineup, as they are supposed to…if you scroll down the page you will see that the alignment issue gets worse towards the bottom of the page.

    May 27, 2015 at 2:00 pm #450559
    greenpomodoro

    So is no way to line up all the rows and columns? wow. I find it hard to believe I am the first person with this issue?

    The “description ” column text does not align with the actual table data. Please some kind of solution is needed!

    May 27, 2015 at 6:22 pm #450743
    Elliott

    Hi!

    How are you wanting to do that? Are you wanting to increase their height so they all span on two lines? Go ahead and take a screenshot and highlight exactly what your trying to do so we can get a better idea.

    Regards,
    Elliott

    May 28, 2015 at 12:27 am #450844
    greenpomodoro

    Hello,

    probable solution is an extra line added to the second row called “cost”.

    Image 1 below shows the issue! the red lines indicate which rows should line up. all very self-explanatory to all who have ever used a spreadsheet or table

    image 1 - problem

    image 2 shows the alignment that I need.

    https://app.box.com/s/y8xkk6dq7nfet59e24ny9ukil7669vnd

    Do you understand what I have written and attempted to demonstrate using screen shots?

    May 28, 2015 at 4:15 pm #451232
    Elliott

    Hey!

    If your wanting to increase the “cost” row then add this to a codeblock element in the page.

    <style type = "text/css">
.pricing-table > li:nth-child(2) {
  height: 65px;
}
</style>

    Your first screenshot is not loading for me.

    Cheers!
    Elliott

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.