Html5 and frameborder

Embracing the change

With HTML5, frameborder goes obsolete. Now styling is all up to CSS. This segregation of structure and presentation vouches for a clean, and maintainable code infrastructure.

Seamless blend

In the arena of modern web design, a seamless and borderless interface often takes the lead. Although the seamless attribute hasn't been depreciated, it doesn't enjoy universal browser support. Hence, relying on CSS for border control remains our best bet.

Backward compatibility

Now let's talk about legacy issues. Say YouTube, for legacy reasons, sometimes uses the frameborder attribute. However, in the spirit of best practices, I would strongly recommend CSS to ensure compatibility.

Worried about older browsers particularly IE8 and earlier? Then you can use conditional comments for IE-specific styles:

<!--[if lte IE 8]>
<style>
    /* Because old habits die hard, IE! :) */
    iframe { border:0; }
</style>
<![endif]-->


JavaScript to the rescue

In rare cases when CSS fails to deliver, JavaScript's onload event is there to make amends:

window.onload = function() {
    /* We're assigning collective public service here :) */
    var iframes = document.getElementsByTagName('iframe');
    for (var i = 0; i < iframes.length; i++) {
        iframes[i].style.border = '0';
    }
};


Remember, JavaScript solutions are heavier and should ideally be your plan B when the CSS fails to yield.

Global reach with CSS

To extend the borderless look across your site, use external CSS instead of inline styles:

/* Let's broaden our horizon */
iframe {
    border: none; /* No borders for all the iframes in the house */
}


Neat & tidy

While dealing with depreciated attributes like frameborder, opting for CSS proves beneficial for cleaner code. This not only ensures you're on pace with the latest paradigm but also paves way for easier maintenance in future.

Weighing JavaScript wisely

Avoid JavaScript or DOM manipulation if CSS can get the job done. Thin, lightweight code leads to faster page load speed keeping your users happy and engaged.