We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Header width

Featured Lock Resolved Task
Hey there,

is it possible to enlarge the (in my example white) header background so that it fits the whole width of the display? It works fine in every row except the fixed header.
And by the way, can I center the menu?

Thanks in advance!

Attachments (1)

  • header.jpg
    header.jpg 26.9 KB

11 Answers

Pavel

More than a month ago #Permalink
Please try this Custom CSS and check.

Hey. It seems to me that your code is absolutely not what is needed. :o
The first thing need to properly divide the Header into columns for all devices. For example for a desktop it is 2 + 8 + 2.
Then, use the following code:

/*Stretch the Header, to the full width of the screen*/
#sp-header {
max-width: 100%;
}
/*Align the menu in the center*/
#sp-header .sp-megamenu-wrapper {
float: none;
padding-right: 0;
text-align: center;
}

Ofi Khan - Staff

More than a month ago #Permalink
Please try custom CSS for this.

- Best regards

DJAtze

More than a month ago #Permalink
Thanks for the reply, but what do I have to add there?
I'm not that familiar with CSS.

Ofi Khan - Staff

More than a month ago #Permalink
Please provide your site URL here or PM me.

- Best regards

DJAtze

More than a month ago #Permalink
It's https://jahresgeschehen.eu/

Kind reagrds

Ofi Khan - Staff

More than a month ago #Permalink
It's https://jahresgeschehen.eu/

Kind reagrds


Please try this Custom CSS and check.


@media (min-width: 992px)
.col-md-9 {
width: 60%;
}


Screenshot_135.png

- Best regards

Attachments (1)

  • Screenshot_135.png
    Screenshot_135.png 525.1 KB

DJAtze

More than a month ago #Permalink
Cool, that solves the problem with the header width.
To center the menu doesn't work unfortunately, but that's okay.

Many thanks, Pavel!

Pavel

More than a month ago #Permalink
Add some more code

.sp-megamenu-parent {
float: none;
}

Ofi Khan - Staff

More than a month ago #Permalink
Thanks, Pavel for your reply. I missed that column thing.

- Best regrads

DJAtze

More than a month ago #Permalink
Now it's perfect! Thank you very much, Pavel!


There are no replies made for this post yet.
Be one of the first to reply to this post!

123

Templates

327508

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us