列和内嵌中心图像 [英] Columns and Inline Center Image

查看:102
本文介绍了列和内嵌中心图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

.com / 0xaC5.pngalt =>

我使用这段代码:

I am using this code:

-moz-column-count: 2;
-webkit-column-count: 2;
column-count: 2;

当我在div类中放置另一个div时,它格式化为两列。如何解决这个问题?

When I place another div within the div class, it formats to go into two columns. How do I fix this?

推荐答案

使用以下CSS:

Use these following CSS:

 <style type="text/css">
  .container{ background:#00FF00;width: 844px;text-align:center; margin: 0px auto;border: 1px solid #CCCCCC;height: 450px;}
  .columns {background:#FF0000; width: 400px;border: 1px solid #595959; height: 450px;text-align:left;float:left; padding: 10px;left:5%;}
  .popup_middle_content{background:#FFFFFF; border: solid 1px black; position: absolute; left: 50%; top: 50%;background-color: white;z-index: 1; height: 50px; margin-top: -150px; width: 200px;margin-left: -100px; }
</style>

请检查以下div:

And check with these below divs:

  <div class="container">
       <div  class="columns">Left Paragraph contents...</div>
       <div  class="columns">Right Paragraph contents...</div>
       <div  class="popup_middle_content">CENTER DIV content...</div>
  </div>

它适用于我。我希望这对你有帮助。

It is works for me. I hope this helps to you.

这篇关于列和内嵌中心图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆