如何在一个部分中居多个div?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (1)

我知道存在一个问题,这些解决方案似乎都不适用于我,这是2014年发布的一个问题。

这是我的代码:

 <section id="team-block">
  <div class="team-block-centered">
    <div class="col-lg-3 col-sm-6 member-1">
      <div class="team-member">
        <img
          src="http://lvsmiledesigners.com/new/wp-content/uploads/2019/06/dr-tongsiri.jpg"
          data-original="http://lvsmiledesigners.com/new/wp-content/uploads/2019/06/dr-tongsiri.jpg"
          alt=""
          class="lazy"
          style="display: block;"
        />
        <div class="inner">
          <h4 class="name">Dr. Amy Tongsiri</h4>
          <p class="position">
            <small>Clinical Director</small>
          </p>
        </div>
        <div class="hover">
          <div class="description">
            <p>
              Dr. Amy Tongsiri has joined Smile Designers of Las Vegas in 2017.
              She has a joyous energy vibrating the room as she enters. Almost
              permanently smiling, she exudes positivity and can easily relaxed
              and soothe a nervous patient. The desire to pursue a career in
              dentistry came young for Dr. Tongsiri, during the course of her
              own dental health. "I originally wanted to do orthodontics, when I
              had braces,” she says, flashing the resulting perfect smile. “But
              eventually, I found General Dentistry to be more exciting because
              you are challenged by being able to cover everything."
            </p>
          </div>
          <div class="read-more">
            <a href="/new/dr-amy-tongsiri/" class="button white outline"
              >Read more <span class="nc-icon-glyph arrows-1_bold-right"></span
            ></a>
          </div>
        </div>
        <!--.hover-->
      </div>
      <!--.team-member-->
    </div>
    <!--.col-lg-3-->
  </div>
  <div class="col-lg-3 col-sm-6 member-2">
    <div class="team-member">
      <img
        src="http://lvsmiledesigners.com/new/wp-content/uploads/2019/07/Dr-Dominique-Dela-Cruz.jpg"
        data-original="http://lvsmiledesigners.com/new/wp-content/uploads/2019/07/Dr-Dominique-Dela-Cruz.jpg"
        alt=""
        class="lazy"
        style="display: block;"
      />
      <div class="inner">
        <h4 class="name">Dr. Dominique Dela Cruz</h4>
        <p class="position">
          <small>Lead Dentist</small>
        </p>
      </div>
      <div class="hover">
        <div class="description">
          <p>
            Providing comprehensive dental care that is tailored to each and
            every patient’s needs is Dr. Dominique Dela Cruz’s goal when it
            comes to treating patients. She strives to provide dental care in a
            comfortable environment while using the most innovative and advanced
            technology. Dr. Dela Cruz grew up in Las Vegas, NV. On her spare
            time, she likes to stay outdoors as much as possible. She loves to
            hike, travel, kayak and snowboard. She also likes to read books and
            watch movies with her dogs. Like most of her patients, Dr. Dela Cruz
            has a sweet tooth and enjoys eating candy, chocolate and other
            pastries.
          </p>
        </div>
        <div class="read-more">
          <a href="/new/dr-jorge-jimenez-marquez/" class="button white outline"
            >Read more <span class="nc-icon-glyph arrows-1_bold-right"></span
          ></a>
        </div>
      </div>
      <!--.hover-->
    </div>
    <!--.team-member-->
  </div>
  <!--.col-lg-3-->
  <div class="col-lg-3 col-sm-6 member-3">
    <div class="team-member">
      <img
        src="http://lvsmiledesigners.com/new/wp-content/uploads/2019/06/karla.jpg"
        data-original="http://lvsmiledesigners.com/new/wp-content/uploads/2019/06/karla.jpg"
        alt=""
        class="lazy"
        style="display: block;"
      />
      <div class="inner">
        <h4 class="name">Karla Brown</h4>
        <p class="position">
          <small>Office Manager</small>
        </p>
      </div>
      <div class="hover">
        <div class="description">
          <p>
            Delivering outstanding customer service has always been an essential
            part of a day’s work for Karla. As Smile Designers of Las Vegas
            Office Manager, she is responsible for all office procedures, and
            uses her organizational skills to ensure smooth operations in a busy
            work environment.
          </p>
        </div>
        <div class="read-more">
          <a href="/new/nancy-gutierrez/" class="button white outline"
            >Read more <span class="nc-icon-glyph arrows-1_bold-right"></span
          ></a>
        </div>
      </div>
      <!--.hover-->
    </div>
    <!--.team-member-->
  </div>
  <!--.col-lg-3-->
  <div class="col-lg-3 col-sm-6 member-4">
    <div class="team-member">
      <img
        src="http://lvsmiledesigners.com/new/wp-content/uploads/2019/06/nancy.jpg"
        data-original="http://lvsmiledesigners.com/new/wp-content/uploads/2019/06/nancy.jpg"
        alt=""
        class="lazy"
        style="display: block;"
      />
      <div class="inner">
        <h4 class="name">Nancy Gutierrez</h4>
        <p class="position">
          <small>Lead Back Office Assistant</small>
        </p>
      </div>
      <div class="hover">
        <div class="description">
          <p>
            As Smile Designers of Las Vegas lead dental assistant she says her
            coworkers and easy-going patients make it a pleasure to go to work
            every day. She loves been a part in patients journeys to a better
            and healthier oral health.
          </p>
        </div>
        <div class="read-more">
          <a href="/new/karla-brown/" class="button white outline"
            >Read more <span class="nc-icon-glyph arrows-1_bold-right"></span
          ></a>
        </div>
      </div>
      <!--.hover-->
    </div>
    <!--.team-member-->
  </div>
  <!--.col-lg-3-->
</section>

这是现场网站:http//lvsmiledesigners.com/new/

该部分属于“我们的团队可以帮助您!” 头。我担心的是Amy博士的div。我不确定为什么Amy博士的图像宽度比其他图像窄。

提问于
用户回答回答于

换句话说,图像宽度非常短= 173px原始,它应该超过204px。

热门问答

关于web表情包集成?

最爱开车啦互联网的敏感者
推荐
表情使用方式有两种方式: 1)是使用 TIMFaceElem 中的 index,标识表情的索引,比如 Android 和 iOS 两端都有同一套表情图,索引2为笑脸,index=2 就表示笑脸,两端发送和接收都显示同一张索引表情图片即可。 2 ) 是使用 TIMFaceElem ...... 展开详请

如何将本地的.json格式的文件部署到服务器上, 通过url请求?

使用 CDS-Mask 做数据合作,怎么确保双方都不能反推对方的 ID?

用户2134289

腾讯科技 · 高级工程师 (已认证)

推荐
您好,两种方案可以解决您的需求 1)如果您这边ID不需要在业务上使用,将ID进行加星脱敏即可,加星后的所有数据字符将变为*,无法还原; 2)如果您这边ID在业务上需要使用,也就是ID在处理后必须保持唯一性,那么需要采用腾讯数港算法解决该问题,数港算法目前灰度中,如需要申请,烦请通...... 展开详请

cos.sliceUploadFile支持断点续传吗?

如果用的是 cos-js-sdk,那么 cos.restartTask 是会断点续传的,用法没有问题。 PS: sdk 使用可以参考 demo.js https://github.com/tencentyun/cos-js-sdk-v5/blob/master/demo/demo...... 展开详请

数据万象持久化在JavaScript SDK中的问题?

可以的,有Domain参数。请参考:https://github.com/tencentyun/cos-js-sdk-v5/blob/master/csp/csp.html#L56

有谁用unity 3d 实现过对象的上传储存和者下载?

我不是米

腾讯 · 工程师 (已认证)

对象存储工程师
推荐

请正确填写bucket参数,bucket参数里面不要带上-appid

所属标签

扫码关注云+社区

领取腾讯云代金券