Question

因此，如果您在chrome http://gameittourney.fyoucon.com中打开此页面，您会看到某个内容的高度设置不正确，请按home并告诉它现在该怎么样没有镶边的人的图片它应该看起来如何我不知道为什么会发生这种情况

的jQuery

$(document).ready(function(){
    $("#mainContent").css("height", window.innerHeight);
    $(".leftContentBorder").css("height", $("#mainContent").height());
    $(".rightContentBorder").css("height", $("#mainContent").height());

    var docHeight = $(document).height();
    var footerHeight = $('#footer').height();
    var footerTop = $('#footer').position().top + footerHeight;

    if (footerTop < docHeight) {
    $('#footer').css('margin-top', 10 + (docHeight - footerTop) + 'px');
    }

    var mh = $(window).height();
    var h = $(document).height();
    if( mh < h) {
        $("#mainContent").css("height", h);
        $(".leftContentBorder").css("height", $("#mainContent").height());
        $(".rightContentBorder").css("height",   $("#mainContent").height());   
    }


$(window).resize(function() {
    var mh = $(window).height();
    var h = $(document).height();
    if( mh < h) {
        $("#mainContent").css("height", h);
        $(".leftContentBorder").css("height", $("#mainContent").height());
        $(".rightContentBorder").css("height", $("#mainContent").height()); 
    }
    else {
        $("#mainContent").css("height", window.innerHeight);
        $(".leftContentBorder").css("height", $("#mainContent").height());
        $(".rightContentBorder").css("height", $("#mainContent").height());

    }

    var docHeight = $(document).height();
    var footerHeight = $('#footer').height();
    var footerTop = $('#footer').position().top + footerHeight;

    if (footerTop < docHeight) {
    $('#footer').css('margin-top', (docHeight - footerTop) + 'px');
    }
});
});

HTML

<!doctype html>
<html>
<head>
<link rel="stylesheet" href="stylesheet.css" type="text/css">
<meta charset="utf-8">
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">  </script>
<script src="resize.js" type="text/jscript"></script>
<title>GameIT Tourney</title>
<style type="text/css">
</style>
</head>

<body>
<div id="contentBox">
    <div class="leftContentBorder"></div>
    <div class="rightContentBorder"></div>
    <div id="mainContent">
        <div class="header"><a href="/"><img src="img/CampusDjursland_Tourneyhjemmeside_grafik/RESTEN/Header_img.png" /></a></div>
        <div class="navBar">
            <ul>
                <a href="/"><li>HOME</li></a>
                <a href="/"><li>ABOUT</li></a>
                <a href="/"><li>CONTACT</li></a>
            </ul>
        </div>
        <div class="info">
            The GameIT College Tourney is a "web hub" to the different<br/>
 e-Sports tournaments hosted on Campus Djursland.<br/><br/>
            Do you plan on making a tournament? With prizes or just for fun?<br/>
 Contact us at;<br/>
            <a href="mailto:CampusDjurslandTourney@fyoucon.com" class="email">CampusDjurslandTourney@fyoucon.com</a><br/>
            and we'll help you host the information and register participants.
      </div>
        <div class="divideLineBig"></div>
        <div class="currentTour">
            <div class="titel"><img src="img/CampusDjursland_Tourneyhjemmeside_grafik/RESTEN/Right_arrow.png"/>
            CURRENT TOURNAMENTS
            <img src="img/CampusDjursland_Tourneyhjemmeside_grafik/RESTEN/Left_arrow.png"/>
            <div class="divideLineSmall"></div>
            </div>
            <a href="/"><img class="imageCenter" src="img/LolT.png"/></a>
        </div>
        <div class="divideLineBig"></div>
        <div class="currentTour" style="background-color:#e1e1e1;">
            <div class="titel"><img src="img/CampusDjursland_Tourneyhjemmeside_grafik/RESTEN/past_pil_right.png"/>
            PAST TOURNAMENTS
            <img src="img/CampusDjursland_Tourneyhjemmeside_grafik/RESTEN/past_pil_left.png"/>
            <div class="divideLineSmall"></div>
            </div>
            <a href="/"><img class="imageCenter" src="img/LolT.png"/></a>
        </div>
        <div id="footer">
        <img class="imageCenter" src="img/CampusDjursland_Tourneyhjemmeside_grafik/FOOTER/Footer_divideline.png"/>
            <div style="padding: 5px 5px 5px 5px;">
                All images are the properties of their respective owners.<br>
                Coded by Mikkel Hjortshoej © 2013 | Graphics and Design by Alexander Nass Kahr © 2013
            </div>
        </div>
    </div>
</div>
</body>
</html>

Answer 1

如果我正确理解你的问题（周围的div没有扩展到子内容的高度），如果你添加display：block;在.currentTour类的内部，你应该很好。

.currentTour a {
  display: block;
}

div的高度未正确设置

1 个答案: