Css 如何在两个不同大小的DIV';在保持他们反应灵敏的同时?

Css 如何在两个不同大小的DIV';在保持他们反应灵敏的同时?,css,twitter-bootstrap,Css,Twitter Bootstrap,我正在尝试对齐两个div底部的按钮。它们大小不一,我想不出来。如果我给较小的div一个最小高度:514px;它在较小的屏幕上会太大 我正在使用引导 <div id="front_page_body" class="container"> <div> <div class="col-md-4 centered"> <h2>Want to learn programming skills and get a

我正在尝试对齐两个div底部的按钮。它们大小不一,我想不出来。如果我给较小的div一个最小高度:514px;它在较小的屏幕上会太大

我正在使用引导

    <div id="front_page_body" class="container">
    <div>
      <div class="col-md-4 centered">
        <h2>Want to learn programming skills and get a better job?</h2>
        <p>More than just a hacker school, PDX Code Guild offers small class sizes with individual attention. All PDX Code Guild Programs are designed to get you the best education possible in just a few intense months! Jumpstart your career!  <br>
          <br>
          PDX Code Guild offers:</p>
        <ul>
          <li>Python-based Junior Developer Training</li>
          <li>Get Technical! A Workshop for Non-technical Startup Founders</li>
          <li>Assisted Freelancing</li>
        </ul>
        <p>If you're considering upgrading your skills, we would love to hear from you! To start the conversation <a href="contact/">contact us</a>, or take the direct route and apply today!</p>
        <p class="text-center"> <a href="/apply/" class="btn btn-primary btn-lg">Interested!</a> </p>
      </div>

      <div class="col-md-4 centered">
        <h2>Events - PDX Code Guild Python Peer Mentoring Night</h2>
        <p>Come on down to PDX Code Guild for Monday Python Peer Mentoring Night. This event is free and open to the public. We invite all levels of programmers from beginner to expert. There’s something for everyone at this event! You can mentor, learn and network!</p>
        <ul>
          <li>At NedSpace on 5th
          <br/>1400 SW 5th, 3rd floor</li>
        </ul>
        <p class="text-center">
        <a href="http://calagator.org/events/search?tag=PDXCodeGuild" class="btn btn-primary btn-lg" target="_blank">Upcoming Events</a>
        </p>
    </div> <!-- /.col-md-4 --></div>
    </div>

想学习编程技能并找到一份更好的工作吗?
PDX代码公会不仅仅是一所黑客学校,它还提供小班教学和个人关注。所有的PDX代码公会计划都是为了让你在短短几个月内获得最好的教育!开始你的事业吧

PDX代码公会提供:

  • 基于Python的初级开发人员培训
  • 获取技术信息!为非技术创业者举办的研讨会
  • 辅助自由职业者
如果你正在考虑提升你的技能,我们很乐意听到你的消息!开始对话,或者直接走这条路,今天就申请

事件-PDX代码公会Python同侪辅导之夜 周一Python同侪辅导之夜,请到PDX代码公会。这项活动是免费的,对公众开放。我们邀请所有级别的程序员,从初学者到专家。在这次活动中,每个人都会有收获!您可以指导、学习和建立网络

  • 在5号的NedSpace
    西南1400第5层,第3层


我本来打算发布一张图片,但我还不够酷。该站点是

I快速而肮脏的解决方案是使用媒体查询,并在崩溃为移动视图之前更改两个断点的代码。为按钮指定一个特殊的类.imabutton,并向容器div.imadiv添加一个类

@media screen only and (min-width: 1230px) {
  .imadiv {min-height:514px;}
  .imabutton {position:absolute; width:100%; bottom:0;
}

@media screen only and (min-width: 990px) {
  .imadiv {min-height:607px;}
}
这样做的缺点是每次添加/删除内容时都必须更改这些最小高度。或者,您可以使用javascript强制将.imadiv设置为相同的高度,并使用与上述相同的.imabutton代码。类似这样的事情-