Google Chrome Toolbar breaking website layout

css, google-chrome, google-chrome-extension, web

Solution

A Javascript snippet can disable ask toolbar in chrome. I hope this function spreads quickly!!

function removeAsk(){
    if(document.getElementById("apn-null-toolbar") != null){
        // mainMenu had a style change for its top positioning, returning it to normal
        // perhaps a function can be made which iterates over every element ask has changed
        document.getElementById("mainMenu").style.top = "-16px";
        // Just remove the iframe and style elements
        (elem=document.getElementById("apn-null-toolbar")).parentNode.removeChild(elem);
        (elem=document.getElementById("apn-body-style")).parentNode.removeChild(elem);
    }
}

Call this method after body onload

<body onload="removeAsk()">

Problem

I have an issue with Google Chrome: 19.0.1084.52 m when I have the Ask Toolbar installed it breaks the website layout. See print screen: Is it usual behaviour that toolbars in Chrome would effect the website? EDIT: I guess I should wrap everything inside a `<div>` and move the background-image from the `<body>` although is there a better option without adding this extra markup? Website link

Original source