Spacing issue

[agent47]

SITE DETAILS:
http://www.superheroalliance.net
Powered by SMF 2.0 RC3
TinyPortal 1.0 beta 5.2
English
Noize
Google Chrome 8.0

Ok here's the thing. I recently I implemented a jQuery image slider on my site and ever since it has been causing a prob on my left panel or rather the center panel. I managed to find out what was causing this. I basically couldn't get my FIRST left panel block to display without a "Title style" and every time I did, it would mess the center panel of the site. Maybe the screens will help you guys understand more.

This screen is my FIRST left panel block (the adbrite ad.) with a title style which doesn't cause any harm to the site except for the fact that it leaves a small chunk of blank space above it.



This is an image when my FIRST left panel block doesn't have a title style. Look what it does to the jQuery slider. It moves the jQuery slider down and leaves a big chunk of space above it.



Now the reason I want to get this sorted is because having an advertisement with a title style just messes the look of the site plus that little blank space it leaves above it even with the title style enabled just makes the site look lame. So please help me get this sorted out and I would really appreciate it. Since you guys know the code of Tiny Portal at the back of your mind I figured you'll will know what's interfering with the code to cause this. I've attached a code of the jQuery slider that's used on a php block of tiny portal along with this post. You guys won't believe how long I have been trying to resolve this issue.

The jQuery slider that I've implemented on my site is the Nivo slider

P.S: The spacing issue doesn't occur when u have disabled JS on your browser so I'm assuming it's JS messing with TPs CSS class atleast that's what the guy who tried helping me resolve this issue said.

Thanks alot in advance.

[WillyP]

The issue is caused by the style declarations in the code for the slider.  Those may have been included as part of a demo and are not needed, or removing them entirely might mess up the slider.

I removed 'vertical-align: baseline'  and your ad block moved up where it should be.  I would suggest commenting out the following code from the embedded stylesheet, and try it out maybe the slider will get messed up, in which case you need to find what resets are needed and which are not.

Code Select Expand

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}

[agent47]

Like I said from day, this is the most amazing support forum I have been to. It's like the after sales is simply incomparable except in this case we don't even pay for the product which makes it even more amazing. Need I say keep up the awesome. THANKS LOADS. You guys will never know how much I appreciate this.
You may mark this topic as solved