So the company I am working for suggests the use of one of the
Javascript+CSS rounded corners solutions. But I myself do not believe
in using Javascript for pure presentation, and I believe that
sacrificing the bandwidth to load all this JS is not worth the
benefit.

On the other hand, the solution I currently have is also a little
complex and heavy. It uses 3 images and 3 DIV layers. The header and
footer images in total probably take more bandwidth than the JS in the
other solution. The benefit I see in this solution is that there is no
3rd party (no JS to worry about). There are only DIV layers and CSS
classes that are already defined, so no JS is involved in
presentation.
Another benefit is that I can give the boxes any type of shadowing and
patterns in Photoshop to make the style of the boxes match the rest of
the site.

What do you think?

<div class="portalBox">                 
        <div class="portalBox_head">Search Colleges</div>
                                
                                                                                
</div>
<div class="portalBox_foot"></div>

portalBox: is a vertically repeating image

portalBox_head: a fixed width and height rectangle which has a non
repeating image with the top left  and right corners rounded

portalBox_foot: a fixed width and height rectangle which has a non
repeating image with the bottom left and right corners rounded

div.portalBox{
        float:left;
        width: 524px;
        text-align:left;
        background-image: url(../images/portals/portalBox_blue_re.jpg);
        background-repeat: repeat-y;
}
div.portalBox_head{
        width: 524px;
        height: 25px;
        float:left;
        background-image: url(../images/portals/portalBox_blue_head.jpg);
        background-repeat: no-repeat;
        text-align:left;
        font-size:14px;
        font-weight: bold;
        color: #333;
        padding: 0.6em 1em;
        margin:0;

        
}
div.portalBox_foot{
        float:left;
        width: 524px;
        height: 12px;
        background-image: url(../images/portals/portalBox_blue_foot.jpg);
        background-repeat: no-repeat;
}


What I want to know is am i just being stubborn about not using an
easier solution(The JS), or am I right saying that the solution is too
complex and no JS should be involved?

If there is a better no JS solution, im all ears!

Thank You,
Parag Jagdale
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to