PDA

View Full Version : Tab Contect Script 2.2



sjl18gb
10-13-2008, 09:33 PM
1) Script Title: Tab Content Script (v 2.2)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm

3) Describe problem:
I have this script used to pull different users blogs onto 1 page.
see http://hopenet.scottlaplanteproductions.com/blog2.asp

my question...how can i get the whole script to be centered on the page, as opposed to left aligned?

or would i be further ahead to just resize everything to fill the page?

Thanks!
sjl

ddadmin
10-14-2008, 11:20 PM
Centering the ouput shouldn't be a problem, as long as your tabs aren't floated "left' in the CSS. The first demo on the DD script page isn't, so to center the output is just a matter of some tweaks to the CSS. Note the changes in red:


<h3>Demo #1- Basic implementation</h3>

<ul id="countrytabs" class="shadetabs" style="text-align:center">
<li><a href="#" rel="country1" class="selected">Tab 1</a></li>
<li><a href="#" rel="country2">Tab 2</a></li>
<li><a href="#" rel="country3">Tab 3</a></li>
<li><a href="#" rel="country4">Tab 4</a></li>
<li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
</ul>

<div style="border:1px solid gray; width:450px; margin: 0 auto; padding: 10px">

<div id="country1" class="tabcontent">
Tab content 1 here<br />Tab content 1 here<br />
</div>

<div id="country2" class="tabcontent">
Tab content 2 here<br />Tab content 2 here<br />
</div>

<div id="country3" class="tabcontent">
Tab content 3 here<br />Tab content 3 here<br />
</div>

<div id="country4" class="tabcontent">
Tab content 4 here<br />Tab content 4 here<br />
</div>

</div>

<script type="text/javascript">

var countries=new ddtabcontent("countrytabs")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()

</script>

sjl18gb
10-15-2008, 04:23 PM
This got the "content" part centered.....but it moved the tabs to the center as well. I'd like to keep those aligned left...

thanks!

ddadmin
10-15-2008, 05:22 PM
The first code in red above aligns the tabs, so if you don't want that, just remove that code.