doudang4568 2014-04-21 06:13
浏览 57
已采纳

Css风格不起作用

this is my worksite - mysite i have created a page and called it to the home page using the following code

<div class="hilight-hometext">
<?php if(is_front_page()) :
$home_page_post_id = 308;
$home_page_post = get_post( $home_page_post_id, ARRAY_A );
$content_home = $home_page_post['post_content'];
$content_title = $home_page_post['post_title'];
?><?php
echo $content_home;
endif; ?></div>

and the result is

<div class="hilight-hometext">
<div id="hilightbox">
<div class="hilightbox-text">
<h2>At Salisbury we want everyone to understand their landscaping choices</h2>
Our latest landscaping innovation is our Outdoor Vision questionnaire. We’ll guide you     through a set of questions that will help you realize what you want out of your yard.

</div>
<!-- end tier 2 text -->
<div class="hilightbox-action">

<a class="myButton" href="resources/the-outdoor-vision-tool/">GET STARTED</a>

Your Outdoor Vision

</div>

</div></div>

i have added the styling as follows

#hilightbox {
background: url(../img/action-bg.jpg);
width: 100%;
margin: 20px auto;
}
#hilightbox .hilightbox-text {
width: 75%;
float: left;
margin: 0;
}
#hilightbox .hilightbox-action {
width: 25%;
float: left;
padding: 15px 0;
}
.myButton {
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c9df23),         color-stop(1, #747728));
background: -moz-linear-gradient(center top, #c9df23 5%, #747728 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9df23', endColorstr='#747728');
background-color: #c9df23;
display: inline-block;
color: #ffffff;
font-family: Arial;
font-size: 20px;
font-weight: bold;
padding: 14px 14px;
text-decoration: none;
text-shadow: 1px 1px 0px #747728;
}

but the background image and the styles are not showing up.Please help!! Thanks

  • 写回答

1条回答 默认 最新

  • dongqiuge5435 2014-04-21 06:25
    关注

    I think if you just add this:

    #hilightbox {
      background: url(../img/action-bg.jpg);
      width: 100%;
      margin: 20px auto;
      overflow: hidden;
    }
    

    it will solve you problem. currently your container div #hilightbox does not know about child div's (.hilightbox-text and hilightbox-action) height & width because of float:left property.

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥20 求一个html代码,有偿
  • ¥100 关于使用MATLAB中copularnd函数的问题
  • ¥20 在虚拟机的pycharm上
  • ¥15 jupyterthemes 设置完毕后没有效果
  • ¥15 matlab图像高斯低通滤波
  • ¥15 针对曲面部件的制孔路径规划,大家有什么思路吗
  • ¥15 钢筋实图交点识别,机器视觉代码
  • ¥15 如何在Linux系统中,但是在window系统上idea里面可以正常运行?(相关搜索:jar包)
  • ¥50 400g qsfp 光模块iphy方案
  • ¥15 两块ADC0804用proteus仿真时,出现异常