Jump to content


Photo
Resolved

Unable To Display Table Border Line In Content Column



This topic has been archived. This means that you cannot reply to this topic.
8 replies to this topic

#1 ian123

ian123

    Member

  • Members
  • PipPip
  • 10 posts

Posted 26 October 2012 - 03:46 PM

Hi,

Anyone got any idea why when I create a table with border under pages, but the border will not display when I browse the website. Furthermore, I found the alignment of the table content also gone and it stretch to the full width.

Anyone face this problem before?

Thank You.

#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 26 October 2012 - 04:05 PM

The table border needs to be added with Custom CSS: http://www.pagelines...wiki/Custom_CSS

For reference to the border CSS property, please see: http://www.w3schools...f/pr_border.asp

#3 ian123

ian123

    Member

  • Members
  • PipPip
  • 10 posts

Posted 27 October 2012 - 02:55 AM

HI,

Thanks for the suggestion, but I already added the CSS at html page, but it's still unable to display the table properly.

You can refer to the sample page at http://111.90.130.15...any-background/

Do you have any idea on it?

Thank You

#4 James B

James B

    Advocate

  • Members

  • 5126 posts

Posted 27 October 2012 - 04:12 AM

Hi there, I don't think you're css is correct as it seems to be displaying at the top of your page.

You can use the following to add a border to the table

 
.hentry table td, #comments table td {
    border: 1px solid black;
    padding: 0.35em 0.6em;
    text-align: center;
}


#5 ian123

ian123

    Member

  • Members
  • PipPip
  • 10 posts

Posted 27 October 2012 - 07:50 AM

Hi,

Yes. It's working fine now.

Thanks alot!

#6 ian123

ian123

    Member

  • Members
  • PipPip
  • 10 posts

Posted 27 October 2012 - 08:08 AM

Hi There,

Can I know is it possible to have different table design on each page? Because once I added the CSS code in custom CSS, it will reflect it to all the content pages.

Thank You,

#7 batman

batman

    Bat Learning

  • Members

  • 2167 posts

Posted 27 October 2012 - 09:37 AM

Hi ian123
Yes, you can use

 .page-id-XX .hentry table td, #comments table td{ border: 1px solid black;padding: 0.35em 0.6em;text-align: center;}


If you also wish to know how I find the page ID, all you need to do is load up FireBug or Google Chromes web dev tool and inspect your page html, at the top you should see body which has a number of classes assigned to it, one of these is page-id-XX (replace XX with your pages id value. I have added a screenshot to assist you.


Posted Image


#8 ian123

ian123

    Member

  • Members
  • PipPip
  • 10 posts

Posted 27 October 2012 - 10:29 AM

Dear Batman,

Thanks alot. You're awesome.

Thank You

#9 Danny

Danny

    Is Awesome!

  • Moderators
  • 17139 posts

Posted 28 October 2012 - 09:44 AM

The topic was marked as resolved.