html - IE 中的 float 未正确对齐

标签 html css wordpress internet-explorer

我试图让我的 div 在 IE 中正确 float 。它们在 Chrome 和 Firefox 中看起来很棒,但 IE 会破坏代码。你可以在这里看到 jsfiddle:http://jsfiddle.net/vlyandra/kEm3R/基本上,图像 div 没有与条目 div 水平对齐,底部的表格(尽管有最大宽度)没有调整大小。生成帖子的代码如下:

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="bordered centered">
    <p class="negative-margin alignleft header"><?php the_title(); ?></p><p class="negative-margin alignright date"><?php the_date(); ?></p><div style="clear:both;"></div>
    <?php if ( is_search() ) : // Only display Excerpts for Search ?>
        <div class="entry-summary">
            <?php the_excerpt(); ?>
        </div><!-- .entry-summary -->
    <?php else : ?>
        <div class="entry-content negative-margin">
            <?php if ( has_post_thumbnail() ):?>
            <div id="entry-left">
                <?php   $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'large');
                echo '<a href="' . $large_image_url[0] . '" title="' . the_title_attribute('echo=0') . '" >';
                echo get_the_post_thumbnail($post->ID, 'large'); 
                echo '</a>';?>
            </div>
            <div class="entry-right">
                <?php the_content( __( 'More <span class="meta-nav">&rarr;</span>', 'huckleberry' ) ); ?>
                <?php wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'huckleberry' ), 'after' => '</div>' ) ); ?>
            </div><div style="clear:both;"></div>
            <div class="entry-right">
                <table class="fixed-height fixed-width">
                    <tr>
                        <td class="valigned"><h3 class="date">Details</h3>
                            <?php the_field('details');?>
                        </td>
                        <td class="valigned">
                            <a href="<?php echo MultiPostThumbnails::get_post_thumbnail_url(get_post_type(), 'secondary-image');?>">
                                <?php if (class_exists('MultiPostThumbnails')) : MultiPostThumbnails::the_post_thumbnail(get_post_type(), 'secondary-image'); endif; ?>
                            </a>
                        </td>
                        <td class="valigned">
                            <a href="<?php echo MultiPostThumbnails::get_post_thumbnail_url(get_post_type(), 'tertiary-image');?>">
                                <?php if (class_exists('MultiPostThumbnails')) : MultiPostThumbnails::the_post_thumbnail(get_post_type(), 'tertiary-image'); endif; ?>
                            </a>
                        </td>
                        <td class="valigned">
                            <a href="<?php echo MultiPostThumbnails::get_post_thumbnail_url(get_post_type(), 'fourth-image');?>">
                                <?php if (class_exists('MultiPostThumbnails')) : MultiPostThumbnails::the_post_thumbnail(get_post_type(), 'fourth-image'); endif; ?>
                            </a>
                        </td>
                    </tr>
                </table>
            </div>
            <?php else : ?>
                <?php the_content( __( 'More <span class="meta-nav">&rarr;</span>', 'huckleberry' ) ); ?>
                <?php wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'huckleberry' ), 'after' => '</div>' ) ); ?>
        </div>
            <?php endif; ?>
    <?php endif; ?>

如有任何帮助,我们将不胜感激!

最佳答案

我没看到。能否发送一个指向您网站的链接?

此外,您是否尝试过将 .alignleft 应用于图像?

关于html - IE 中的 float 未正确对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14916817/

相关文章:

css - 使用 Google Chrome 时图像不会显示在媒体打印品中

html - 悬停图像中的问题

html - 垂直菜单奇怪的填充

php - Wordpress Customizer 隐藏自定义部分?

Javascript/jQuery 事件处理程序未加载

html - 增加容器宽度(不是高度),在文本换行时

javascript - 如何纠正从 jsFiddle 到 HTML 的 no wrap(head) JavaScript 以使其正常工作

wordpress - 将 Wordpress Core 包含到自己的脚本中

javascript - 当鼠标悬停在没有CSS的标题上时,如何使缩略图消失?

html - 我无法从我的 WP 网站上的表格中删除边框