Elementor Question posted in
A comprehensive tutorial library can be found here.

Elementor – If condition based on CSS style

is it possible to create an if statement regarding the CSS? I am using a WordPress theme Hello and Elementor. I have blog posts set in two columns. I can’t add additional html, plus it updates all the time when new posts are published. BUT I noticed that the theme automatically sets a position left:50% for the ones on the right side. I would like to edit the CSS of the blog posts on the right side.

Like:

if ( left == 50%) {
  margin-top = 50px;
}

<div class="premium-blog-post-outer-container"style="position: absolute; left: 0%; top: 0px;">
            <div class="premium-blog-post-container premium-blog-skin-modern">
                                <div class="premium-blog-thumb-effect-wrapper">
                    <div class="premium-blog-thumbnail-container premium-blog-zoomin-effect">
                                  </a>
                            </div>
    <div class="premium-blog-post-outer-container"style="position: absolute; left: 50%; top: 0px;">
            <div class="premium-blog-post-container premium-blog-skin-modern">
                                <div class="premium-blog-thumb-effect-wrapper">
                    <div class="premium-blog-thumbnail-container premium-blog-zoomin-effect">
                                  </a>
                            </div>

EDIT:vI tried now this, but nothing happens?

function blog_post_right() {
?>
<script>
const posts = document.querySelectorAll('.premium-blog-post-outer-container')
for (let post of posts) {
    if (post.styles.left === '50%') {
        post.styles.left = 'margin-top: 150px;'  // insert styles here
    }
}</script>
<?php
}
add_action( 'wp_head', 'blog_post_right' );
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    This actually worked out with simple CSS nth:child


  2. 0 
    const posts = document.querySelectorAll('.premium-blog-post-outer-container')
for (let post of posts) {
    if (post.style.left === '50%') {
        post.style.left = ''   // insert styles here
    }
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search