How to change header ad position

[creaturex]

Hi everyone,

Would someone be able to tell me how to change the position of the header ad in VB5 please?

I would like the header of my forum (http://forum.canadahifi.com/) to look the same as the header of my main site www.canadahifi.com.

Hence I would like the header ad to be displayed to the right of my logo, and then slide the "Search" box to appear below that.

I would really appreciate someone's (detailed) help

Thank you,

creaturex

[glennrocksvb]

Try adding these in css_additional.css template:

#header { position: relative; }
#header-axd {
    position: absolute;
    top: 36px;
    left: 388px;
    z-index: 1;
}
#header .toolbar {
    position: absolute;
    {vb:stylevar right}: 0;
    bottom: -29px;
    padding: 0;
    display: block;
    width: auto;
}
.search-container .search-box .search-term { width: 120px; }

[creaturex]

Thank you for the prompt response Glenn. When I try to edit this file I get this error:

" Sorry, you don't have permission to access the administrative controls on this page. If you need to access this page, ask your lead administrator to enable your permissions for this page using the Administrator Permissions section of the control panel."

But when I look at the Admin Permissions, all of the options are set to 'YES'.

My vBulletin is running on the vBulletin Cloud hosting service... does that make a difference?

[Mark.B]

Hi

You're on Cloud so you would add this in Site Builder > Style > CSS Editor
Select the style you're using and paste it there.

[creaturex]

This worked perfectly gentlemen - thank you for your quick responses!

[glennrocksvb]

This worked perfectly gentlemen - thank you for your quick responses!

You're welcome. Though it doesn't quite work nicely on smaller screens. With the size of your ad, it should snap back to the top of the logo when there is no room available in the header. Use these css instead:

#header, #wrapper { position: relative; }
#header-axd {
    position: absolute;
    top: 7px;
    right: 8px;
    z-index: 1;
}
#header .toolbar {
    position: absolute;
    right: 0;
    bottom: -29px;
    padding: 0;
    display: block;
    width: auto;
}
.search-container .search-box .search-term { width: 120px; }
@media all and (max-width: 1099px) {
    #header-axd {
        position: relative;
        top: auto;
        right: auto;
    }
}