Archived

This topic is now archived and is closed to further replies.

  • 0

Tables


Question

Posted · Report post

Are there any built in table style options in Pagelines Framework?

 

If I was to use custom css for a table styling, would i use syntax similar to what's below?

 

In page:

 

<table id="table-name"></table>

 

Then in the Custom Code admin panel:

 

.table-name { }

 

 

Thanks!

Share this post


Link to post
Share on other sites

7 answers to this question

Posted · Report post

Hi,

 

Actually, PageLines does not have any special table handling, but WordPress tends to handle tables a bit oddly. If specific CSS isn't added, they have all sorts of styling issues.

 

I recommend CSS tables instead of standard HTML.  Try this:  http://coding.smashingmagazine.com/2008/08/13/top-10-css-table-designs/

 

Alternatively, we have a Grid system which is like a table. That may be found here: http://demo.pagelines.me/tools/

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

OK, interesting!  Using nested grids, I can likely get the arrangement nailed down, but how about styling?

 

If I used a span4/span8 configuration, then a nested 4/8 on span 8, is there a way to put a border/background on the whole right side span8, including the nested 4/8 pans?

Share this post


Link to post
Share on other sites

Posted · Report post

Wrap the whole thing inside a div with a unique class like <div class="mygridback">, then, create some CSS like

.mygridback {background-image:....}.  The custom CSS goes in Dashboard > PageLines > Site Options > Custom Code

 

That will let you place a background behind the whole group. Just remember to add the closing </div> at the end.

Share this post


Link to post
Share on other sites

Posted · Report post

Awesome!  That totally worked.  That demo page is very handy, had never seen it before.

 

 

Ok, I think I'm down to the last snafu...

 

I set up a grid with nested spans, in span 4 there's a list of text, in span8 there are single file audio players.  The players have a slightly different heigt than the text, so the 10 lines of text in the first column, are shorter than the ten columns of audio players.  I've tried adding style="line-height:26px" to the div classes, experimented with different values/font sizing and can get it close, but it still looks off.  I also tried wrapping each row's content into a separate nested grid.  That fixes the vertical issue, and each row is aligned horizontally, unfortunately this also puts double spacing between every row.  I'm guessing this is due to the theme's styling for grids.  Is there some way to achieve spacing sync between the 2 spans?

Share this post


Link to post
Share on other sites

Posted · Report post

Honestly, I'd have to see it to give you some guidance. 

Share this post


Link to post
Share on other sites

Posted · Report post

The arrow graphic is your culprit.  It needs to be resized or replaced with one no higher than the oval image with the plus sign. That's what's pushing text apart.

Share this post


Link to post
Share on other sites