.wpsites-portfolio .portfolio {
float: left;
clear: none;
padding: 0 15px 15px;
padding: 0 1.5rem 1.5rem;
width: 33.33333333%;
}
.wpsites-portfolio .portfolio:nth-of-type(3n+1) {
clear: left;
}
Can't get this code to work. It only displays the first 2 featured images on the CPT portfolio archive page rather than 3. It then displays one after another.
wpsites-portfolio is a custom body class i added for the CPT archive file in the Twenty Twelve theme
Remove padding and then check...
Related
Working on a wordpress site. Having trouble aligning a product category block. First it would only display 4 products when per. row if i set to 5, 3 if set to 4, etc. I fixed that, something to do with margins. The category block is slightly off center, really annoying. Below is some code for the block that i used. Any help would be appreciated.
https://rightwaycrane.staging.wpengine.com/pendant-control-stations/
.page-id-1608 .wc-block-grid__product {
margin: 0;
padding-top: 15px;
padding-bottom: 15px;
padding-right: 15px;
padding: 15px;
}
It looks like the following styles are causing your content to not be centered correctly.
.content-part-left {
padding: 50px 30px 20px 98px;
}
.content-part-left ul {
padding-left: 40px;
}
.content-part-left ul {
padding-left: 20px;
}
If you remove or adjust it should resolve the center on page issue.
.content-part-left {
padding: 50px 30px 20px;
}
.content-part-left ul {
padding: 0;
}
got myself in a tight spot here, the widget on the right hand side of my website has lost its formatting, i need it all in one line, and to drop below the left hand widget when viewed in mobile: https://aurexgroup.com/
Im using a enfold child theme on a wordpress site.
i assume its a css issue, but i cant find the code that relates.
i have looked through the css style sheet in the theme, this is all i could for widgets find:
}
#top li.sf-widget-element{
list-style: none;
clear: none;
margin-left: 0;
padding: 0;
width:auto;
display:inline-block;
margin-right: 30px;
}
And then this in the quick css section in the enfold general styling tab:
}
#footer .flex_column{
float: right;
}
#footer .flex_column.first{
float: left;
}
.footer_color a, .footer_color .widget_first{
color: #cf5c1a !important;
}
#footer .flex_column .widget{
margin-top: 0;
margin-bottom: 0;
line-height: 26px;
display: inline-block;
width: 100%;
}
.copyright a[href*="kriesi"]{
display:none !important;
}
Very open to any ideas!
please help!
I am attempting to make a horizontal navigation bar in a jekyll site. I am not sure if the CSS I am using is incorrect, or if it's not compiling correctly with Jekyll.
Here is my current approach:
- Make changes in _scss/_layout.css
- Check the changes are there in _site/main.css (they are)
- Check for errors in jekyll serve console (don't see any)
When I look at my generated site and hit inspect, I don't see the CSS changes being applied.
Sass code in _sass/_layout.scss:
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
li {
list-style-type: none;
margin: 0;
padding: 0;
}
h1 {
text-align: center;
font-weight: 200;
}
header {
background: $header;
padding: 0px 15px;
text-align: center;
margin: 50px 0 0;
height: 50vh;
display: flex;
justify-content: center;
align-items: center;
}
Full repo for my site is here - https://github.com/ericadohring/groupdayout/ and help would be greatly appreciated!
Github pages isn't showing changes anymore because there is an error that prevents Jekyll to build your site.
In _sass/_layout.scss there is a property that is using an undefined variable:
header {
background: $header;
...
}
To fix it just assign a value to it before using the variable, e.g.:
$header: #f0ad4e;
header {
background: $header;
...
}
Now you will be able to work on your site and seeing the changes reflected in Github pages.
Have looked on SO for an answer, but I seem to have one stemming from mods I did to style.css header. Actually, not sure mods have 'pushed' hamburger menu off the screen or I just need to adjust colour. When one forst goes to site - menu items appear in word format, not collapsed menu, then disappear.
I am working on WP, using Genesis framework for my website - shinwag.com
.responsive-menu-icon {
cursor: pointer;
display: none;
text-align: center;
}
.responsive-menu-icon::before {
content: "\f333";
display: inline-block;
font: normal 20px/1 'dashicons';
margin: 0 auto;
padding: 10px;
}
.site-header .responsive-menu-icon::before {
padding: 0;
}
http://www.shinwag.com/wp-content/themes/lifestyle-pro/style.css line 1959
.genesis-nav-menu.responsive-menu > .menu-item > .sub-menu, .genesis-nav-menu.responsive-menu in this class put display:block; remove display:none;
i'm having an issue with WordPress Avada theme i'm not managing to solve myself.
I need to have the logo in the menu like this:
body #header-sticky .logo, #header .logo {
margin-right: 0px;
margin-top: 20px;
margin-left: 0px;
margin-bottom: 16px;
}
but something override it to:
element.style {
margin-right: 0px;
margin-top: 31px;
margin-left: 0px;
margin-bottom: 31px;
}
and i don't see what is it in my style.css
I can't find where to modify the final HTML file the theme produces, does anyone knows how to achieve this?
NinjaMate.com
use !important
body #header-sticky .logo, #header .logo {
margin-right: 0px !important;
margin-top: 20px !important;
margin-left: 0px !important;
margin-bottom: 16px !important;
}
or use shorthand css
body #header-sticky .logo, #header .logo {
margin: 20px 0px 16px !important;
}
In your backend go to Appearance > Theme Options > Logo, there you will find all the options related to your logo (including the margin)