How to add a full-width logo in the header

[AltBraKz]

Sorry for bumping an old thread, this works great but now I need to adjust my search bar so it’s cantered vertically and moved inwards a bit. I’m not sure what to do to adjust that

[glennrocksvb]

Adjust the right and bottom properties in this block of code:

#header .toolbar {
    position: absolute;
    right: 0;
    bottom: -30px;
    padding: 0;
    width: auto;
}

[AltBraKz]

Thank you!

[SPX]

Will this work on vb cloud 6.0.5 or just the regular version?

[glennrocksvb]

Will this work on vb cloud 6.0.5 or just the regular version?

It should work on both vBCloud and self-hosted.

In general, pure HTML, CSS and JS changes should always work on both since there's no client-side differences between the two.

[John Waggoner]

I am trying to make the header full width in vB 6.0.5 but it is not working.

I have added the css code from the first post in this thread.

Here is the before header.

Before adding CSS code. Size 1200 x 159 px.

After adding the CSS code.
It only moved the search box. No change to the header graphic at all. I have tried doubling the size to 2400px and there was no difference.

I would really like to create the flag background as the header background then add the graphic as the logo. What am I missing?

[SPX]

Pay the man his money...
Hire Glenn to do it.. Why get frustrated. Time is money and his rates are reasonable.

[John Waggoner]

Thanks Glen,

The url is https://tst.forums.ncrs.org

[glennrocksvb]

Your image is too narrow to fit in the width of the window at just 800px. I recommend using a wider logo at 1920px (at least).

Or you can keep the existing logo and just stretch it to fit the window but the image quality may suffer. Use this CSS as additional code to the code in the first post.

#header .site-logo img {
    width: 100%;
}

[John Waggoner]

The image that I uploaded is 1200 px wide. I tried it at 2400 px just to see what it would do and it didn't extend any more.

When I entered the CSS code:

#header .site-logo img {
width: 100%;
}

the header extended the full width.

Thanks for your help. I purchased the Main Nav Dropdown Menu v1.6 - and it worked like a charm. I am going to purchase the AJAX Search next. May find a couple other add-ons as well.

Thanks again for your help.

[glennrocksvb]

The system may be resizing the uploaded image based on the configured maximum size in the Attachment Manager in AdminCP. You had a similar issue as this one:

https://vbmods.rocks/forum/questions-and-feedback/new-modification-requests-suggestions/29942-vbulletin-6-header