JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container_block">
    <table class="container_table">
        <tbody>
              <tr class="row-1">
                      <td class="col-1">
                            <div class="field-title"><span class="field-content"><a href="#">Lorem Ipsum</a></span></div>  
                            <div class="article_popup_container">
                                <div class="field-content">
                                    <div class="article_popup">
                                        <div class="article_popup_photo"><a href="#"><img src="http://image_path"/></a></div>
                                        <div class="article_popup_text">Lorem Ipsum</div>
                                    </div>
                                </div>  
                            </div>          
                      </td>
                      <td class="col-2">
                            <div class="field-title"><span class="field-content"><a href="#">Lorem Ipsum</a></span></div>  
                            <div class="article_popup_container">
                                <div class="field-content">
                                    <div class="article_popup">
                                        <div class="article_popup_photo"><a href="#"><img src="http://image_path"/></a></div>
                                        <div class="article_popup_text">Lorem Ipsum</div>
                                    </div>
                                </div>  
                            </div>        
                       </td>
              </tr>
              <tr class="row-2">
                      <td class="col-1">
                            <div class="field-title"><span class="field-content"><a href="#">Lorem Ipsum</a></span></div>  
                            <div class="article_popup_container">
                                <div class="field-content">
                                    <div class="article_popup">
                   ...

CSS

.container_block {
width: 280px;
background-color: grey;   
margin-left:300px;    
}

.field-title {
width: 150px;
height: 30px;
padding: 5px;
margin:0;    
}


.article_popup_container .field-content {
position: relative;   
}

.article_popup {
display: none;   
position: absolute;
width: 150px;
top:0px;
background-color: yellow;
}

.col-1 .article_popup {
right: 180px;
}

.col-2 .article_popup {
left: 180px;
}

JavaScript

(function ($) {
    $(document).ready(function(){
        $('.field-title').bind('mouseenter', function() {
        $('.article_popup').fadeIn();
        });
        $('.field-title').bind('mouseleave', function() {
        $('.article_popup').fadeOut();
        });
    });
}(jQuery));