Content Full width layout

Hi i use “Content Full width layout” i like the edge of page look like but in high resolution screens not looks nice, so i decide to use only Full width layout and not Content Full width layout. But there is a small problem the edge of pages in a normal resolution it is a bit gathered inside, see attached
full width: https://monosnap.com/direct/M9FHuQ44TJCngbVHSDNMCZaXOqDPiD
Content Full width: https://monosnap.com/direct/SM1oNRveUBX1sHoAGgPtUi3cT1pgWw
the content full with have less margin is it possible to decrease the margin in “full with” so to keep bigger the elements?

Thanks a lot

Hello,

Please provide the site admin access to the private area I will provide the custom CSS.

Best Regards

ok

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

@media (min-width: 1025px){
body .main-page-wrapper .container:first-child {
    max-width:100%;
}
}

Best Regards

Hi thanks but i am not sure that this code is those i need. This convert the content in full width but keep the header and menu in full please check it.

I need to use Full width but decrease the space right and left please see the first ticket and screenshoots. Yoursolution give me the same effect as “Content Full width” option
https://monosnap.com/direct/skfCAhf1IGqCFT6KRb0tYjo3bzB2J6

in fact i need to expand whole page content to take advantage of space right and left.

Hello,

Try this code:

body .site-mobile-menu li.current-menu-item>a{
color:red;
}
body .site-mobile-menu .sub-menu li a {
    color: red;
}

As per the header set the full-width header https://xtemos.com/docs/woodmart/header-builder/global-header-settings/

Best Regards

Why colour red?? You probably answer in wrong ticket

Hello,

I do apologize I copied the wrong CSS.

Here it is:

@media (min-width: 1025px){
body .main-page-wrapper .container:first-child {
    max-width:100%;
}
body	footer .container.container:first-child {
    max-width:100%;
}
	
}

Best Regards

https://monosnap.com/direct/tIYWquOVQeAxamQ04oxTFlF4gi8aJY
do you try the css before provide?? PLease read my first post what exactly i need to do and tell me if this possible. Thanks

i just need `.container {
max-width: 1400px;
}`

but for media up to 1024

Here is the code:

@media (min-width: 1025px){
body .main-page-wrapper .container:first-child {
    max-width: 1400px;
}
body	footer .container.container:first-child {
    max-width: 1400px;
}
body .whb-main-header {
    max-width: 1400%;
}	
}

Have you set full-width for the header in the Header builder?

Best Regards

i think fix it my self i looking for this

@media (min-width: 1400px){
 .container {
    max-width: 1400px;
}

is it correct?

Hello,

In this case, all the containers would take this width even those you do not need. That is why I specify which container should take this width.

Best Regards

i need to expand all containers

If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts