左边一个icon,右边是文字，实现水平垂直居中，右边文字长度不确定，如何实现水平垂直居中？（注：ie9不支持flex）

<div> <table style="margin:0 auto"> <tr> <td><img src="icon.png"/></td> <td>确认删除该日程吗？</td> </tr> </table> <div>

ie9。。。试试用vertical-align:middle吧还有line-height这个好基友。

css 两个宽度不确定的浮动元素 如何水平垂直居中

实现功能

使用 table-cell + vertical-align+ text-align + inline-block + clear + float，实现浮动子元素的水平垂直居中。

效果图

解决方案

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>两个浮动元素的垂直水平居中</title>
    <style>
        .parentBox{
           background-color:#ccc;
            width:220px;
            height:220px;

            /* 子元素的水平垂直居中：table-cell + vertical-align + text-align */
            display:table-cell;
            vertical-align: middle;
            text-align: center;      
        }
        .parentBox .clearFloatBox{
            border:1px solid red;
            display:inline-block;  /* 不要指定这个div的宽和高 */
           
            /* width:200px; */
            /* height:100px;  */

            clear:both;  /* 删掉也不影响居中效果*/
        }
        /* 浮动元素1 --- 左边图片定宽高  */
        .clearFloatBox img{
            width:20px; 
            height:20px;
            float:left;
        }
          /* 浮动元素2 --- 右边文字不定宽高*/
        .clearFloatBox span{
            float:right;
        }
    </style>
</head>
<body>
    <div class="parentBox">
        <!-- 因为tablecell对浮动元素无效，所以外面包裹一个div，使得tablecell直接在div上操作-->
        <div class="clearFloatBox">   
            <!-- 左浮动img元素 -->
            <img src="../images/error.svg" alt="错误按钮图标">
             <!-- 右浮动span元素 -->
            <span>确定要删除吗？</span>
        </div>
    </div>
</body>
</html>

css 两个宽度不确定的浮动元素如何水平垂直居中

实现功能

效果图

解决方案

你尚未登录，登录后可以

扁平化数组转换成树形?

省市区街道数据在哪里可以下载？

网站的不同域名互相跳转如何保持登录态？

Vue项目一个报错无法找到原因?

如何自定义设置虚线边框的样式？

前端有没有办法实现页面截图？

只用一个div，宽高固定，文本内容不固定，能不能实现水平、垂直居中，超出两行显示省略号？

css 两个宽度不确定的浮动元素 如何水平垂直居中

实现功能

效果图

解决方案

你尚未登录，登录后可以

扁平化数组转换成树形?

省市区街道数据在哪里可以下载？

网站的不同域名互相跳转如何保持登录态？

Vue项目一个报错无法找到原因?

如何自定义设置虚线边框的样式？

前端有没有办法实现页面截图？

只用一个div，宽高固定，文本内容不固定，能不能实现水平、垂直居中，超出两行显示省略号？

css 两个宽度不确定的浮动元素如何水平垂直居中