How to apply drop shadow to a javascript widget?

How do I apply a css drop shadow around the search widget generated by this script code?
<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script type="text/javascript">if (WIDGETBOX) WIDGETBOX.renderWidget('dfacd65d-6514-4845-ad81-7249d33a6280');</script>
<noscript>Get the <a href="http://www.widgetbox.com/widget/college-search">College search</a> widget and many other <a href="http://www.widgetbox.com/">great free widgets</a> at <a href="http://www.widgetbox.com">Widgetbox</a>! Not seeing a widget? (<a href="http://support.widgetbox.com/">More info</a>)</noscript>

 

Do you have access to the Iframe? Else it can't be done.

 

sorrry for that i don't know.......

 

Use FireBug(Developer Browser Plugin) to find out what the containing div is and write a override CSS code in your main CSS file.

I do things like that all the time. Ive also made a small youtube hack to fix the youtube iframe within a website.

 

Just to simply put a shadow on the entire widget that is contained within the script?

If you want just a simple shadow (even though the script is cutting off some of the scroll bar when more than a few searches are found), implement this into a CSS file.

#shadow{width:455px;height:auto;box-shadow:5px 5px 15px #000;border:1px solid #000;}

Code (markup):

Implement <div id="shadow"> on the beginning of your script and a </div> at the end of your script like so.

<div id="shadow">
<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script type="text/javascript">if (WIDGETBOX) WIDGETBOX.renderWidget('dfacd65d-6514-4845-ad81-7249d33a6280');</script>
<noscript>Get the <a href="http://www.widgetbox.com/widget/college-search">College search</a> widget and many other <a href="http://www.widgetbox.com/">great free widgets</a> at <a href="http://www.widgetbox.com">Widgetbox</a>! Not seeing a widget? (<a href="http://support.widgetbox.com/">More info</a>)</noscript>
</div>

Code (markup):

If you want to change the location of the shadow, here's how you do it.

5px 5px 5px 15px
The first 5 is horizontal. This decides the horizontal direction that your shadow will go. <--- --->
The second one is vertical as in up and down. Setting both of these to 0 will make it display right under your element.
The third number is blur, this determines how blurry your shadow will be.

Play the numbers in the box-shadow format to get the desired setting you like. If this isn't what you meant, clarify a bit and we'll see what we can do.

 

Actually its a little more indepth then that. If you have a square widget, that will work fine. But as far as adding a shadow to a rounded border. You may add a border-radius but if you would really want to put a border shadow on the actually widget source, You will have to open the iframe and find the tag of the container div, then call the CSS after the widget with !important tags in your CSS in your source code.