Blog Icons Off Center (Renew 01 Stack)

Hello guys,

I’m having a minor issue in the blog section of my website (worldvespa.net/blog).
The icons of every post (next to the post’s title on the left- see the image I uploaded) are off center (not alighned).

How can I fix the problem?

Thanks in advance,
Stergios

Hi Stergios,

Thanks for writing in! Could you please try adding the following CSS rule into your X -> Theme Options -> CSS area and see if that helps.

@media (min-width:980px){
  .x-full-width-active .entry-title:before,.x-content-sidebar-active.entry-title:before {
    margin-left:-15.00%;
  }
}

Thanks!

1 Like

Unfortunately, I don’t see any change.
Maybe I have some other code interfering? I don’t know.
It happened after the last X update.

That’s the code that already exists into my X -> Theme Options -> CSS area:

.single-x-portfolio .x-portfolio .entry-info,
.single-x-portfolio .x-portfolio .entry-extra {
    float: none;
    width: 100%;
}
.page-id-15543 .site, .page-id-15543 .x-navbar.x-navbar-fixed-top.x-container-fluid.max.width {
width: 100%;
max-width: 100%;
}
.page-id-15557 .site, .page-id-15557 .x-navbar.x-navbar-fixed-top.x-container-fluid.max.width {
width: 100%;
max-width: 100%;
}
.x-btn-navbar, .x-nav-wrap {
display: none !important;
}.x-topbar .x-social-global {
display:none;
}
.x-topbar {
    background-color: #ffd700;
  	height: 35px;
}
.lang-item {
    display: inline;
}
.masthead {
    background-color: #ffd700;
}
@media only screen and (min-width: 980px) {
.x-full-width-active .entry-title:before, .x-content-sidebar-active .entry-title:before {
font-size: 28px !important;
}
}
.wp-post-navigation-next {
padding: 20px 0px;
}
.x-author-box.cf {
    clear: both;
    margin: 50px 0 0;
}
@media (max-width: 767px){
.x-logobar {
clear: both;
}
}

Hi There @s_gogos

Could you please remove all of your custom CSS rules in X -> Theme Options -> CSS area temporarily and re-test this issue again.

If you’re still having issues, provide us with your login credentials in a secure note to investigate it further.

Thanks!

Thanks for the reply!

I tried what you suggested.
I removed all the custom CSS, cleared all cache but this didn’t solve the problem (it messed up the site a bit).

I then tried to only paste the CSS you wrote. This:

@media (min-width:980px){
  .x-full-width-active .entry-title:before,.x-content-sidebar-active.entry-title:before {
    margin-left:-15.00%;
  }
}

Again, the problem insists.

Thanks for the support.

Hi there,

Please try this:

@media (min-width: 981px) {
    .x-full-width-active .entry-title:before, 
    .x-content-sidebar-active .entry-title:before {
        left: 18px;
    }
}

Hope this helps.

Thanks for the reply!

By adding what you said I now have this problem:

The icon moved to the right and covered the first letter on the post title.

Hello There,

I can see that you are using Renew stack. Please be informed that in renew stack, you will have to option to use standard and creative entry icon position. You can check this settings in X > Theme Options > Renew > Blog Option. And when you select “Creative”, there is a setting to adjust the horizontal and vertical alignment of the entry icon. You do not need any custom css to re position the icon.

Please check it out.

1 Like

Thank you very much! This solved the problem!

You are most welcome. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.