错误的图片对齐

时间:2014-12-14 06:38:07

标签: html css html5 wordpress css-float

您好我的问题是位于中间列的照片。我该如何解决这个问题。此外,我必须告诉你,我正在使用WordPress,我正在尝试使用“Nectar Shortcodes”在Salient主题中构建它,同样在下面的代码中你有我的网站的链接,但你不能访问它它正在维护中。我应该在全局CSS选项框中输入内容吗?

这是一个视频,以帮助您理解,这里我使用的是视觉作曲家: https://www.youtube.com/watch?v=Q1LixRT2LR0

  [heading subtitle="Proiectele noastre"] [/heading]
[one_third][image_with_animation animation="Fade In From Left" image_url="DELETED WEBSITE NAME" delay=""] [/image_with_animation] [/one_third]
[one_third][image_with_animation animation="Fade In From Bottom" image_url="DELETED WEBSITE NAME" delay=""] [/image_with_animation][/one_third]
[one_third_last][image_with_animation animation="Fade In From Right" image_url="DELETED WEBSITE NAME" delay=""] [/image_with_animation][/one_third_last]

[one_third][image_with_animation animation="Fade In From Left" image_url="DELETED WEBSITE NAME" delay=""] [/image_with_animation][/one_third]
[one_third][image_with_animation animation="Fade In From Bottom" image_url="DELETED WEBSITE NAME" delay=""] [/image_with_animation][/one_third]
[one_third_last][image_with_animation animation="Fade In From Right" image_url="DELETED WEBSITE NAME" delay=""] [/image_with_animation][/one_third_last]

enter image description here

HTML PART

 div id="fws_548dc4b895636" class="wpb_row vc_row-fluid standard_section   "  style="padding-top: 0px; padding-bottom: 0px; "><div class="row-bg-wrap"> <div class="row-bg   " style=""></div> </div><div class="col span_12 dark ">
    <div  class="vc_span4 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">
            <div class="img-with-aniamtion-wrap left"><img class="img-with-animation " data-delay="0" data-animation="fade-in-from-left" src="DELETED WEBSITE URL" alt="" /></div>
        </div> 
    </div> 

    <div  class="vc_span4 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">
            <div class="img-with-aniamtion-wrap left"><img class="img-with-animation " data-delay="0" data-animation="fade-in-from-bottom" src="DELETED WEBSITE URL" alt="" /></div>
        </div> 
    </div> 

    <div  class="vc_span4 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">
            <div class="img-with-aniamtion-wrap left"><img class="img-with-animation " data-delay="0" data-animation="fade-in-from-right" src="http://DELETED WEBSITE URL/wp-content/uploads/2014/12/circus.png" alt="" /></div>
        </div> 
    </div> 
</div></div>
    <div id="fws_548dc4b89602e" class="wpb_row vc_row-fluid standard_section   "  style="padding-top: 0px; padding-bottom: 0px; "><div class="row-bg-wrap"> <div class="row-bg   " style=""></div> </div><div class="col span_12 dark ">
    <div  class="vc_span12 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">

        </div> 
    </div> 
</div></div>
    <div id="fws_548dc4b89650a" class="wpb_row vc_row-fluid standard_section   "  style="padding-top: 0px; padding-bottom: 0px; "><div class="row-bg-wrap"> <div class="row-bg   " style=""></div> </div><div class="col span_12 dark ">
    <div  class="vc_span4 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">
            <div class="img-with-aniamtion-wrap left"><img class="img-with-animation " data-delay="0" data-animation="fade-in-from-left" src="hDELETED WEBSITE URL" alt="" /></div>
        </div> 
    </div> 

    <div  class="vc_span4 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">
            <div class="img-with-aniamtion-wrap left"><img class="img-with-animation " data-delay="0" data-animation="fade-in-from-bottom" src="http://www.DELETED WEBSITE URL/wp-content/uploads/2014/12/safe.png" alt="" /></div>
        </div> 
    </div> 

    <div  class="vc_span4 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">
            <div class="img-with-aniamtion-wrap left"><img class="img-with-animation " data-delay="0" data-animation="fade-in-from-right" src="DELETED WEBSITE URL" alt="" /></div>
        </div> 
    </div> 
</div></div>
    <div id="fws_548dc4b896eeb" class="wpb_row vc_row-fluid standard_section   "  style="padding-top: 0px; padding-bottom: 0px; "><div class="row-bg-wrap"> <div class="row-bg   " style=""></div> </div><div class="col span_12 dark ">
    <div  class="vc_span12 wpb_column column_container col no-extra-padding"  data-hover-bg="" data-animation="" data-delay="0">
        <div class="wpb_wrapper">
            <div style="margin-top: 10px; margin-bottom: 10px;" class="divider-border"></div>
        </div> 
    </div> 
</div></div>

1 个答案:

答案 0 :(得分:0)

自豪地宣布FIX

在我使用了firebug之后我发现了这个并且如果我改变了高度:自动到高度的绝对值就像300px一样可以正常工作

.row .col img {
  height:auto;
  margin-bottom:15px;
  max-width:100%;
  width:auto;

FIX- for global CSS

.row .col img {
  height:300PX;
  margin-bottom:15px;
  max-width:100%;
  width:auto;
对于upvotes而言,这是一个匿名的downvotes。另外你的评论确实帮我指出了正确的方向......只需要查看我的HTML / CSS