[thelist] Whitespace Issue using Nifty Corners Cubed

[ben morrison]

On 12/30/06, Taurus James <taurus_james at yahoo.com> wrote:
> Hi,
>
> I'm using Nifty Corners Cubed on a site with JavaScript to create a tabbed display on a page.
>
> http://taurusbeats.com/
>
> The first tab displays fine without a specified height for the div.  However, when you click on a nav button (like "BUY"), the other divs are shown with an excessive amount of whitespace below the content.
>
> I don't think this is a problem with Nifty (directly).

It seems to be a problem with nifty, if you view the rendered source
in firefox [1] or IE [2], underneath buy MP3s you will see the
following code:

    BUY MP3s

        <b class="niftycorners" style="background: transparent none
repeat scroll 0%; margin-left: 0px; margin-right: 0px;
-moz-background-clip: -moz-initial; -moz-background-origin:
-moz-initial; -moz-background-inline-policy: -moz-initial; margin-top:
0px;">

            <b style="border-color: rgb(255, 255, 255);
background-color: transparent;" class="t4"> </b>

            <b style="border-color: rgb(255, 255, 255);
background-color: transparent;" class="t3"> </b>

            <b style="border-color: rgb(255, 255, 255);
background-color: transparent;" class="t2"> </b>

            <b style="border-color: rgb(255, 255, 255);
background-color: transparent;" class="t1"> </b>

        </b>

    </a>

</li>
</ul>

    <b style="height: 413px;" class="niftyfill"> </b>

So i would check your implementation of nifty corners, on a side note
you shouldn't be hiding the content just in case Javascript is turned
off, those nav buttons do not do anything at present, it would be
better to have all the options shown on the page, link to them using
anchors, then use Unobtrusive JS[3] to hide them and show/hide each
div.

[1] http://jennifermadden.com/scripts/ViewRenderedSource.html
[2] http://billfriedrich.tripod.com/index.html?Web
[3] http://www.onlinetools.org/articles/unobtrusivejavascript/
ben
-- 
Ben Morrison