2015-12-11 57 views
0

我正在一個網站www.50s.co上工作,它看起來很不錯,但我看起來在Firefox或IE和背景圖片大小不同,至少它看起來像他們,但它是說圖像大小是同樣,頁面上的某些元素(s)導致問題,但我看不到任何錯誤。元素在其他瀏覽器中調整大小?

我只想讓網站看起來像在其他瀏覽器中的Chrome一樣。

是什麼導致圖像重疊在頁面底部的藍色邊框,我該如何解決它? (將加入我們的頁面是主要的問題,但其他人做一點點)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 

<link rel="icon" type="image/x-icon" href="/images/450fav.jpg"/> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js" type="text/javascript"></script> 
<script src="jquery.carousel.js" type="text/javascript"></script> 
<link href="jquery.carousel.css" rel="stylesheet" type="text/css" /> 
     <meta name="keywords" content="discount, ariels, air conditioning, airport transfers, auto electricians, bathrooms, beauty salons, bedrooms, blinds, curtains, boilers, brake, clutch, builders, burglar alarms, car body repairs, car hire, carpenters, carpet cleaning, carpet fitting, central heating, chiropodists, chiropractors, cleaning services, domestic appliance repair, double glazing, drains, electricians, estate agents, exausts, fencing, garage doors, garages, garage services, gas, guttering, kitchens, landscaper, gardening, grass cutting, locksmith, locksmiths, mot, mots, painters, decoraters, paving, contractors, pest control, plasterers, plumbers, removal, romavals, storage, roofing, roofer, skip hire, tree surgeon, tree services, tyres, vets, wills, probate writting"> 
<link href="browsers.css" rel="stylesheet" type="text/css"> 
     <script type="text/javascript" async="" src="ga.js"></script><script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script> 
     <link rel="stylesheet" href="bootstrap.min.css"> 
     <link href="style.css" rel="stylesheet" type="text/css"> 
     <script src="jquery.min.js"> </script><style type="text/css"></style> 

     <script src="bootstrap.min.js"></script> 
<script src="jquery-1.11.1.min.js" type="text/javascript"></script> 
     <script src="jquery.ui-1.10.4.slider.min.js" type="text/javascript"></script> 
     <link href="css" rel="stylesheet" type="text/css"> 
     <link href="jquery.ui.core.min.css" rel="stylesheet" type="text/css"> 
     <link href="jquery.ui.theme.min.css" rel="stylesheet" type="text/css"> 
     <link href="jquery.ui.slider.min.css" rel="stylesheet" type="text/css"> 
     <script type="text/javascript"> 
      jQuery(document).ready(function($) { 
       /*$(".scroll").click(function(event){  
        event.preventDefault(); 
        $('html,body').animate({scrollTop:$(this.hash).offset().top},900); 
       });*/ 

       $('#change_city').change(function(){ 
        $.post("ajax.php", { city_id: $(this).val() }, function(data) { 
         $("#change_postcode").html(data); 
        }); 
       }); 

       $("#menu_toggle").click(function() { 
        $("#top_menu").toggle(); 
       }); 
      }); 
     </script> 
<meta charset="utf-8"> 
<title>Join 450s</title> 
</head> 

<body> 

<div class="border1"> </div> 
<button type="button" class="navbar-toggle hidden-lg hidden-md hidden-sm" id="menu_toggle" aria-expanded="false"> 
    <span class="sr-only">Toggle navigation</span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
</button> 

    <div class="container"> 
     <div class="row"> 
      <div class="col-md-4 col-sm-12 col-xs-12"> 
       <div class="logo"> 
        <a href="http://50s.co"><br><img src="/images/450slogo.png"></a><br> 
       </div> 
      </div> 

      <div class="col-md-8 col-sm-12 col-xs-12"> 
       <nav class="navbar navbar-default pull-right"> 
        <div class="container-fluid"> 


        <!-- Collect the nav links, forms, and other content for toggling --> 
        <div class="collapse navbar-collapse" id="top_menu"> 
         <ul class="nav navbar-nav"> 
         <li><a class="active" href="http://www.50s.co" data-hover="Home">Home</a></li> 
         <li><a href="http://www.50s.co/why.php" data-hover="Why Us?">Why Us?</a></li> 
         <li><a href="http://www.50s.co/offers.php" data-hover="Offers">Offers</a></li> 
         <li><a style="color:#E31818" href="http://www.50s.co/advertise.php" data-hover="Advertise">Join Us</a></li> 
         <li><a href="http://www.50s.co/contact.php" data-hover="Contact Us">Contact Us</a></li> 
         </ul> 
        </div><!-- /.navbar-collapse --> 
        </div><!-- /.container-fluid --> 
       </nav> 
      </div> 
     </div> 
     <div id="Slider1"></div> 
    </div> 


<div class='border2'> </div> 
<div style="position:relative;width:100%;"><img class="advertise1" style="position:absolute;width:100%;border-radius:0px;" src="images/advertise1.png"/></div> 
<div><img class="advertise2" style="position:absolute;width:100%;border-radius:0px;" src="images/advertise2.png"/></div> 

     <div class="container"> 

      <div class="row"> 

       <div class="col-sm-12 col-xs-12 col-md-6 box1">  
        <div class="box-wrap"> 

<h1 class="title1" style="font-family:'arial';text-align:center;margin-top:2%;">Join 450s</h1> 

<h4 class="heading1" style="font-family:'arial';padding:0px;text-align:center;"><p>Reasons to offer a discount to people over 50:</p></h4> 
<h4><ul type="circle"> 
<li>64.1 million people live in the United Kingdom.</li><br> 
<li>43% or 21.6 million people in the UK are over 50 years old.</li><br> 
<li>14,226 people turn 50 every week.</li><br> 
<li>People over 50 control 80% of private wealth.</li><br> 
<li>The 50 plus generation is the fastest growing group of internet users.</li><br> 
<li>The number of 50 plus people using the internet has increased by 80% since 2002.</li><br> 
<li>Not all people over 50 are wealthy.</li><br> 
<li>Pensioners genuinely need such discounts from private businesses.</li><br> 

<li>All online lead service providers are fee based, at an average of 35+ Pounds per lead, 
which they sell 3 times over and put you in a price war with your competition.</li><br> 

<li>We offer exclusive leads, all over 50 year olds</li><br> 
<li>No price war, No Monthly fees</li><br> 
<li>No Cost per Refferal, Direct contact with the client</li><br> 
<li>No third party referrals, Payment options </li><br> 
</ul></h4> 
<h3 class="heading2" style="font-family:'arial';padding:5px;text-align:center;">Call Today for the Best Exclusive Leads in your area!</h3> 

<strong><h2 class="heading1" style="font-family:'arial';text-align:center;">Call Now On: 0207 078 4229</h2></strong><br> 

</div> 
</div> 
</div> 
</div> 

<div style='margin-top:3%;' class='border2'> </div> 

     <img style=" 
    max-width: 100%; 
    height: auto; 
    width: auto\9; 
    position:relative; clear:bottom; 
display:block;margin-right:auto;margin-left:auto;" src="images/standards.jpg" />   



</body> 
</html> 

Blockquote

+1

請發佈代碼 – AVI

回答

0

你已經在那裏絕對定位的圖像作爲「背景」圖像(但在img標籤!)。這確實沒有道理 - 絕對定位的元素不會自動調整其大小。 將圖像定義爲應包含的元素的真實背景圖像:background: url(…) …,包含您需要的尺寸,附件和重複設置。

+0

謝謝,它確實讓我想起了它的背景,可能應該只是試了一下。 –

相關問題