Question

您好我设计了一个网站，但不幸的是它不能在Chrome中工作，在Firefox和IE中完全没问题。我是HTML编程的初学者。下面是代码。请尽可能协助。

问题是我在代码中放置的按钮没有显示在chrome中的所需位置。

 $j(document).ready(function() {
   if (_jive_effective_user_id == -1) {
     // anonymous or not logged in user
     $j("#getStartedLink").attr("href", "link1");
     $j("#getStartedLink1").attr("href", "link2");
     $j("#getStartedLink2").attr("href", "/login.jspa?fromMP=3193&clickedOnDownload=sd");
     $j("#getStartedLink3").attr("href", "/login.jspa?fromMP=3193&clickedOnDownload=sd");
   } else {
     // logged in user
     $j("#getStartedLink").attr("href", "link3");
     $j("#getStartedLink1").attr("href", "link4");
     $j("#getStartedLink2").attr("href", "link5");
     $j("#getStartedLink3").attr("href", "link6");
   }
 });

.contents {
  <!--margin: auto auto auto -22px;
  --> width: 103.6%;
  background: none repeat scroll 0 0 #000;
}
.shadow {
  padding-top: 0;
  background: none repeat scroll 0 0 #000;
  min-height: 340px;
}
body {
  font-size: 20px;
  font-family: 'FuturaStd-Light';
  line-height: 1.231;
}
#jive-body-main {
  width: 100%;
}
#jive-widget-content {
  padding: 0 0px;
}
#footer .footer-tab-contents .contents {
  background: transparent;
}
.gradient2 {
  display: none;
}
.gradient {
  display: block;
}
.webcast_list li {
  list-style-image: none;
}
.container_12 .grid_7 {
  width: 90%;
}
.tab-inner-devPortal p {
  font-family: 'FuturaStd-Light';
}
.jive-widget-body .jive-html-text-widget ul li {
  list-style-type: disc;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content-inner" style="background-color: white; margin-bottom: 1px; border-bottom:1px solid rgb(210,210,210);">
  <div class="wrap">
    <div class="container_12">
      <div class="grid_6 text-center" style="margin-top:103px;">
        <img src="IMAGE" alt="" style="width:450px; margin-top: -78px;">
      </div>
      <div class="grid_6 box suffix_05" style="padding-right:0px;">
        <p class="" style="font-size:150%; margin-top:-50px;"><strong style="margin-left: -350px;">TEXT</strong>
        </p>
        <p class="lh190" style="font-size:15px;">The <a href="link" target="_new">Text:</a>
      </div>
      <div style="float: left">
        <ul class="webcast_list" style="margin-top: -135px; font-size:15px; margin-left: 510px; list-style-image: none;">
          <li style="margin-bottom: 8px;">Text</li>
          <li style="margin-bottom: 8px;">Text</li>
          <li style="margin-bottom: 8px;">Text</li>
          <li style="margin-bottom: 8px;">Text</li>
          <li style="margin-bottom: 8px;">Text</li>

        </ul>
      </div>
    </div>
    <div class="text-center">
      <a href="HTML form" class="btn-more" style="margin-bottom: -3px; margin-left: -35px; margin-top: 85px; text-transform:none;">Button</a>
    </div>
    <div class="clearfix"></div>
  </div>
</div>

Answer 1

请写清洁代码。我不明白你想做什么！你有4个解决方案：

边距在内联级别元素上无法正常工作。 <a>元素是内联元素。您应该将<a>的显示属性更改为阻止。

<a href="HTML form" style="display: block; margin-bottom: -3px; margin-left: -35px; margin-top: 85px; text-transform:none;">Button</a>
相对定位
绝对定位
您可以设置a。

HTML在Firefox和IE中工作但不在Chrome中

1 个答案: