CSS行对齐问题

i've some CSS problems. I made a row with images and some texts. But images' borders are not in alignment. Here is a screenshot about that. And my CSS codes which i am used:

.portfolyo-foto {
    width: 149px;
    margin-right: 1.2%;
    border: 1px dashed black;
    display: inline-table;
}

.portfolyo-cerceve {
    width: 100%;
    padding-left: 0%;
    height: 100%;
}

.leftTypeWrapperOuter {
    width: 75%;
    position: relative;
    float: right;
    margin-right: 13%;
}

.clearfix {
    display: block;
}

Thanks a lot.

You should include the link in the div.

<div class="portfolyo-foto">
    <img width="100" height="100" src="" />
    <a href="#">All</a>
</div>

and add this rule in css:

.works-filter a,
.works-filter a.active{
    margin:0;
}

Also, remember it is a good practice to share all the needed code.

If you move your links to the bottom of images:

<div class="portfolyo-foto">
  <img src="http://ailuros.bursasinemalari.com/wp-content/uploads/2016/08/placeholder.png" width="100" height="100">
  <a href="#" class="filter active" data-filter="*">All</a>
</div>

and apply the following css:

.works-filter {
    width: 100%;
}
.works-filter a {
    margin: 0; /* overwriting previous margin: 0 5px */
}

you'll get:

Update: Repositioning the a tags in the template

// temporary array to hold a tags
$a_tags = [];

$portfolioTagsArray = array();
$postCounter = 0;
if ( have_posts() ) {
    while ( have_posts() ) {
        the_post();
        $postCounter++;
            $t = wp_get_post_terms( $post->ID, 'ff-portfolio-tag' );
            if( !empty($t) ) foreach ($t as $onePortfolioTag) {
                if( !isset($portfolioTagsArray[ $onePortfolioTag->slug ]) ) {
                    // instead of creating a really long string which contains multiple a tags
                    // store the a tags individually inside an array
                    $a_tags[] = '<a href="#" class="filter" data-filter=".tag-'.esc_attr($onePortfolioTag->term_id).'">'.ff_wp_kses( $onePortfolioTag->name ).'</a>';
                }
                $portfolioTagsArray[ $onePortfolioTag->slug ] = $onePortfolioTag;
            }
            if( $numberOfPosts > 0 && $postCounter >= $numberOfPosts ) {
                break;
            }
    }
}

$terms = apply_filters( 'taxonomy-images-get-terms', '', array('taxonomy' => 'ff-portfolio-tag'));

// now I think, length of $terms array and $a_tags array are equal
// and their items correspond with each other
// if so, what you need to do is
// when you print the div.portfolyo-foto and the img
// simply add the corresponding a tag before closing the div
if ( ! empty( $terms ) ) {
    foreach ( (array) $terms as $key => $term ) {
        print '<div class="portfolyo-foto">';
        print wp_get_attachment_image( $term->image_id, 'taxonomy-thumb' );
        print $a_tags[$key]; // $key should be index, e.g. 0,1,2,3, etc.
        print '</div>';
    }
}