CSS Guru needed as completely stuck.
http://greatives.eu/themes/blade-v2/shop/
This is a theme we are using, but I cannot see any means in CSS of making it go 80 or 90% width. There is always that big gap either side.
I can set it to show three across and the images go bigger.
The idea is that we keep 4 across but put in the side menu.
Can anyone see the easy CSS to add to make the body part go full width?
How can I force this WP theme to be full width - CSS?
Moderator: General Moderators
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
How can I force this WP theme to be full width - CSS?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: How can I force this WP theme to be full width - CSS?
At a glance, it looks like class grve-content has a max width of 1170px.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: How can I force this WP theme to be full width - CSS?
If I add:
. grve-content { max-width: 1900px !important; }
or
#grve-content { max-width: 1900px !important; }
It makes no difference.
. grve-content { max-width: 1900px !important; }
or
#grve-content { max-width: 1900px !important; }
It makes no difference.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: How can I force this WP theme to be full width - CSS?
Yesterday I wrote this:
Trouble is, it affects ALL pages. Even with that second-to-last class:
... which I thought would affect only the .archive classed pages, like categories. But it affects the homepage too.
I need it to only affect category, shop and product pages.
Code: Select all
@media only screen and (min-width: 1230px) {
.woocommerce div .product
{
max-width: 1300px!important;
margin-left: auto;
margin-right: auto;
}
#grve-single-post-meta-bar
{
max-width: 1300px!important;
margin-left: auto;
margin-right: auto;
}
#grve-related-products
{
max-width: 1300px!important;
margin-left: auto;
margin-right: auto;
}
.grve-wrapper .related .products
{
max-width: 1300px!important;
margin-left: auto;
margin-right: auto;
}
body .archive .grve-container,#disqus_thread,#grve-content.grve-left-sidebar .grve-content-wrapper,#grve-content.grve-right-sidebar .grve-content-wrapper
{
max-width: 1700px!important;
}
body .archive #grve-content, .grve-single-wrapper, #grve-main-content .grve-section
{
margin-right: 20px;
margin-left: 20px;
}
}Code: Select all
body .archive .grve-container,#disqus_thread,#grve-content.grve-left-sidebar .grve-content-wrapper,#grve-content.grve-right-sidebar .grve-content-wrapper
{
max-width: 1700px!important;
}I need it to only affect category, shop and product pages.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.