CSS中的浏览器定位

到目前为止，我一直在努力解决很多问题

首先，不同的浏览器响应不同的媒体查询，即使它们都显示在同一屏幕上。我设法解决了那个问题，但现在我被卡住了。我有一个在Chrome和Firefox中运行的图像。如果我在Chrome中修复它，它会在Firefox中失控，如果我在Firefox中修复它，它会在Chrome中崩溃

现在它在Firefox中被破坏了，因为用Firebug比Chrome更容易摆弄它。我曾经尝试过使用特定于供应商的前缀，使用Javascript瞄准Firefox，重写媒体查询，但都没有效果

我从来没有听说过浏览器窗口在同一屏幕上使用不同的媒体查询，我问过的其他人也没有听说过。我非常感谢你的帮助。你可以在www.rachelbrent.com/#about上找到问题所在，如果有人查看CSS（我知道它很乱），它就在base.min.CSS文件中，所讨论的div是img_place#about

编辑以澄清：这是我在“关于”部分的图像（我在顶部的滑块中也有一些其他图像问题。整个事情是一团糟）就代码而言，这是HTML

<div class="fullWidth darkStyle" >
  <div class="container" >
    <div class="separator_mini"></div>
    <div class="nine columns" >
      <div class="mini_description">
        The first time I ever saw HTML I was in middle school and I was trying to figure out how to make a trail of planets follow a cursor around a page about the solar system. My main reference was a Geocities page that used Comic Sans liberally and catered to the Lisa Frank crowd. Yikes.</br>
        <div class="separator_mini"></div>
        Fast-forward ten years. I’ve earned an undergraduate degree from the University of Georgia in Advertising/New Media and I’ve almost completed my master’s in Interactive Media from Elon University. I’ll graduate this May, and I’m ready to take on the world. </br>
        <div class="separator_mini"></div>
        I’ve been lucky to have a wide range of digital communications experience, but I like to think of myself as a design minded strategist.
        <div class="img_place_about" >
          <img src="images/about_image1.jpg" class="scale-img "  >
          <div class="overlay_about social" >
            <ul class="social_bookmarks" >
              <li class="twitter_white noMargin"><a href="http://twitter.com/rbrent" target="_blank"></a></li>
              <li class="facebook_white noMargin"><a href="http://www.facebook.com/rachel.brent" target="_blank"></a></li>
              <li class="gplus_white noMargin"><a href="https://plus.google.com/118253125375848607885/posts" target="_blank"></a></li>
              <li class="linkedin_white noMargin"><a href="http://www.linkedin.com/in/rachelbrent" target="_blank"></a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="sixteen columns" >
      <div class="mini_description">
        I combine my educational background with my work history in public relations, project and social media management, and event coordination to make sure every project gets the most out of its digital content. The best strategy works in concert with good design though, and I always keep that in mind whether working with a team or leading one.  </br>
        <div class="separator_mini"></div>
        I get a thrill from outside the box problem solving and if you’re interested to hear more about that, I’d love to chat. Scroll over my picture to connect now, or check out the rest of my work and drop me a line at the end. Either way, I can’t wait to hear from you. </br>
        <hr>
      </div>
    </div>

针对Firefox：

@-moz-document url-prefix() {
  .img_place_about {    
    display: inline;
    float: right;
    margin-left: 17%;
    margin-top: -25%;
    -moz-margin-top: -25%;
    padding: 5px;
    position: absolute;
    width: 40%;
  } 
}

问题代码：

.img_place_about {
  display: inline;
  float: right;
  margin-left: 17%;
  margin-top: -40%;
  -moz-margin-top: -25%;
  padding: 5px;
  position: absolute;

Firefox的代码应该是什么：

.img_place_about {    
  display: inline;
  float: right;
  margin-left: 17%;
  margin-top: -25%;
  -moz-margin-top: -25%;
  padding: 5px;
  position: absolute;
  width: 40%;
}

---

希望这能有所帮助。我知道这是一个杂乱无章的混乱局面。

你应该发布一些代码，这样我们就可以看到你尝试了什么。你能更具体地说你指的是什么图像吗？ff20中的im和win7中的chrome27，我没有看到任何图像difference@albert好我觉得自己非常愚蠢。我和两位不同的教授坐在一起，他们看了看，我看了看，我的同学看了看，结果总是很糟糕。我不确定是什么修复了它，但有些东西确实修复了。嗯。我现在要去一个尴尬的洞里爬…嘿！别为这事自责。最糟糕的问题是你没问的问题。很高兴你弄明白了。

.img_place_about {    
  display: inline;
  float: right;
  margin-left: 17%;
  margin-top: -25%;
  -moz-margin-top: -25%;
  padding: 5px;
  position: absolute;
  width: 40%;
}