小编Tar*_*ara的帖子

如果父div更长,那么div会延伸到内容的长度吗?

我想将div(我的侧边栏)拉伸到页面底部.我知道我需要添加"身高:100%;" 为了做到这一点.

但是当我添加高度:100%;时,内容比侧边栏少的页面会削减侧边栏的高度,然后您无法看到侧边栏内容.

这是索引页面.一切都看起来就像我想要的那样.

这是一个示例页面.请注意侧边栏已被剪切.

CSS:

#menu-container {
    background-image: url('floral.png');
    width: 300px;
    display: inline-block;
    vertical-align: top;
    height: 100%;
    overflow: hidden; 
    position: absolute;
}

#menu {
    background-image: url('menubg.png');
    width: 220px;
    margin: 0;
    padding-top: 50px;
    padding-left: 30px;
    padding-right: 20px;
    color: #e8e8e8;
    height: 100%; 
}

#content {
    padding: 0px 0px 30px 325px;
    width: 1000px;
    display: inline-block;
    vertical-align: top;
}
Run Code Online (Sandbox Code Playgroud)

提前致谢!

*@Ritabrata Gautam*

改变后的CSS修复了我的第二个问题,但现在我回到了较短页面上的侧边栏:见:http://www.tarawilder.com/staging/?page_id = 19

我现在要离开家了,今晚能够回复.再次感谢你的帮助!

html css height

2
推荐指数
1
解决办法
1万
查看次数

关闭模态时执行某些操作(Bootstrap)

我对Javascript知之甚少,但过去几天我一直在学习很多东西.

在我的生活中,我不能想出这个.

我在Bootstrap中使用模态函数,我已经完成了它的工作和一切.但现在,一旦用户关闭对话框,我想要发生一些事情(插入CSS).

我知道如何插入CSS.单击数据关闭时如何启动它?

谢谢.

编辑:我这样做了吗?它似乎不起作用.

<script>
$(document).ready(function(){
$('.testing').click(function(event){
    $('.modal-body').empty();
    if($(event.target).is('#step2')) {
            $('.modal-body').append('<img src="//placehold.it/600x350/449955/FFF" class="thumbnail img-responsive" id="step100">');
    } else if ($(event.target).is('#step3')) { 
        $('.modal-body').append('<img src="//placehold.it/600x350" class="thumbnail img-responsive" id="step100">');
    } else { }

    $('#modal').modal('show');
    $('#modal').on('hide.bs.modal', function (e) {
            $("#wheel").css("-webkit-animation-play-state","running");
            $(".fa").css("-webkit-animation-play-state","running");
    })
});



});
</script>
Run Code Online (Sandbox Code Playgroud)

模态代码:

<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery twitter-bootstrap

2
推荐指数
1
解决办法
2335
查看次数

标签 统计

css ×2

html ×2

height ×1

javascript ×1

jquery ×1

twitter-bootstrap ×1