Dynamically Tabbed Table

[Jordan]

Stick this in your main header.

<style type="text/css">

div.dtt.container.boards {
    width: 900px;
    margin: 0 auto;
}

</style>

[Former Member]

Thanks... That worked but.. um... how do I align it centered? =)

[Former Member]

Thanks so much! You rock my world =D

[Jordan]

Oops, updated my post above.

Np, if you have Internet Explorer 8 I'd recommend looking at it, as I can't remember if that CSS property will work in IE8. I only have IE9 and can't test right now.

Edit: It works in IE8, I found a way to test it in the developer tools of IE9.

[nunation80]

Jordan. I am having issues displaying the generated code into my forum.

[Jordan]

Forum URL?

[prettymess]

Jordan

I am trying to style the dtt in a certain whay, but i cant quite get it right. At the moment, it looks like this

SPOILER: Click to show

...and i am trying to achieve this..

SPOILER: Click to show

My questions are -

[prettymess]

Jordan

I am trying to style the dtt in a certain whay, but i cant quite get it right. At the moment, it looks like this

SPOILER: Click to show

...and i am trying to achieve this..

SPOILER: Click to show

My questions are:

1 - How do I style a border around the content of each tab?
2 - How can I adjust the border radius to achieve those lovely rounded corners on each tab?
and 3 - how do I change the background of the content area to match the selected tab?

Other than that, this plugin is just brilliant!


My Forum

[Jordan]

Try something like this:

tr.dtt_tabs > th {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}

[Fern]

I did all of the things except the first thing, I'm not quite sure what the <ul> element is?

[Jordan]

Here's a preview of what it does. Notice the "Item 1", "Item 2", and "Item 3". You can click on each of them for information within the tab.

dl.dropbox.com/u/12316030/proboards/dtt/list-preview.png

[Fern]

Right. Did you get on and check it for me... I don't know. I know what it does, I've had it before. It only started acted up about a month ago.

[lillypad]

Hello Jordan, thanks so much for this wonderful little table. It works great except for some reason I can only see it on the main page. I had it in a table in the forum wrappers, tried moving it to the headers/footers and a couple of other layout template areas but nothing seemed to work. Is there any way to fix this?

anruiv5.proboards.com/

Also, while I'm at it is there a way to take out the little borders on the tabs so its one red streak?



Thank you so much!

 

[Avery Grant]

Hello!

I absolutely love the plugin, but for some reason on the current skin on my betazone page the title bar isn't looking like all the other title bars. It looks just fine on my other skin, and I didn't really edit anything.

This particular skin was made for me so I don't know much about the coding, any help would be appreciated!

firewhiskeyandcokete.freemessageboards.com/

Thank you!

[(( Aurora !!]

Nov 10, 2012 16:04:47 GMT -8 Jordan said:

If you want to move the table to a specific place, place the code below wherever you want the table to appear. This can go in your custom templates, headers and footers, or in another plugin. Note that if you put this code in another plugin, this plugin will need to be listed under the other plugin on the Manage Plugins page where you can re-order the plugins. Just make a post in this thread if this doesn't make sense.

SPOILER: Click to show

<div id="move-dtt"></div>

Can you move it into the side tables so that it becomes a tabbed side table? If I can do that, what is the best way to do that? I tried putting that code in two side table plugins but I was not sure where I was meant to be putting it and it did not work where I was trying.