最终学习了HTML5和CSS,但是由于某种原因,我的代码无法正确显示。除了“ topad”外,所有内容都按照我想要的方式显示,只是根本不显示。如果我从div行中删除ID,它会毫无问题地显示。
我知道我的代码可能是一团糟,但是我只想知道为什么嵌套的divs不能显示我期望的方式(并排显示)。
HTML:
<div id="branding" class="clearfix">
<div id="toplogo">
<?php if ( ! is_singular() ) { echo '<h1>'; } ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php esc_attr_e( get_bloginfo( 'name' ), 'blankslate' ); ?>" rel="home">
<img src="<?php echo esc_url( home_url( '/' ) ); ?>wp-content/themes/smcomics/images/logo.jpg" />
</a>
<?php if ( ! is_singular() ) { echo '</h1>'; } ?>
</div>
<div id="topad">blahblahblah</div>
</div>
CSS:
body {
width: 1000px;
margin-left:auto;
margin-right:auto;
background-color: #ddd;
}
#header {
width: 100%;
margin-left: auto;
margin-right: auto;
background-color: #f9b7d3
}
#branding {
width: 100%;
margin-left: auto;
margin-right: auto;
background-color: #a1b2c3;
}
#toplogo {
width: 237;
height: 100;
float: left;
}
#topad {
width: 728;
height: 90;
float: right;
background-color: #023452;
}
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
最佳答案
您错过了在CSS中为ID的PX
和toplogo
写topad
#toplogo {
width: 237px;
height: 100px;
float: left;
}
#topad {
width: 728px;
height: 90px;
float: right;
background-color: #023452;
}
关于php - div嵌套显示不正确,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/22123466/