Team Blog: Why does my page look different in BrowserLab?

Duane O'Brien, engineer on the BrowserLab team has a new blog post on the BrowserLab Team blog that you might find interesting. It covers when/why you might see rendering differences between the BrowserLab browsers and your local browsers. Good info.
http://blogs.adobe.com/browserlab/2011/07/11/why-does-my-page-look-different-in-browserlab /
Bruce
Bruce Bowman
BrowserLab product manager
BrowserLab Team Blog: http://blogs.adobe.com/browserlab
Twitter: @brucebowman, @adobebrowserlab

As Wyodor indicated IE is not the most advance, up-to-date browser out there.
See Roddy’s tips for making iWeb pages more compatible with IE.
OT

Similar Messages

Why does Muse website look different Mac vs. PC

Why do adobe muse websites look different on a Mac vs. PC? www.915day.com for example. Looks great on my mac, but when you go to the PC version it looks zoomed in at least 25-35%? Why? (I have thus adjusted it to look good on a PC.) Frustratingly, to center the Logo for one platform, means to put it off center on the other. Defeats the whole purpose of Parallax scrolling. Also, who would pay so much a month to the creative cloud if they can't even offer their clients continuity? I understand there is a difference between older browsers and new, but it tests the same way even on a new browser (Windows 8 browsers). I have tried adjusting the canvas to the exact measurements of the screen on my PC but it renders the same. Also I have turned on the HiDPI just to see if that was the case. Still no fix. There is only one instance of this in the forums and it has still gone unanswered. So I am asking in greater detail why this is an issue.
Anyone?

I tried to check the site display in multiple browsers on both Mac and windows , but I was not able to verify the issue.
I believe you have already resolved the issue.
Thanks,
Sanjit

Why does my site look different in chrome, safari and explorer?

Hi,
My site looks ok in Firefox but it looks different in chrome, safari and explorer...
I have already tried to clean the cache and delete cookies, what I have to do?
Thanks for helping!
Livia

Hi Livia
I have checked the file and can see that you have used a slideshow for browser background , the page fill is the hero image where the thumbnails are disabled.
If you remove the slideshow then the issue is resolved as the red bar in top and white bar at bottom comes fine with all browsers.
Please remove the slideshow from page background and use the same image as browser fill which will fix the issue.
Thanks,
Sanjit

Why does my page look funny in IE?

My pages look fine in Safari and Firefox, but when I open them in Internet Explorer, there are these large white rectangular shapes that are semi-transparent at the top of my page. Can any one help figure this out? My site isn't finished by any means but I don't want to continue if it's going to look terrible in IE which is what most people use with pc's
http://web.mac.com/lorenbarham/LHDBridal/EntryPage.html

As Wyodor indicated IE is not the most advance, up-to-date browser out there.
See Roddy’s tips for making iWeb pages more compatible with IE.
OT

In FF4, why does my website looks different when www is omitted

''locking as a duplicate - https://support.mozilla.com/en-US/questions/814715''
My site looks different when I use www in the address and when I omit www. Look at http://www.dynapipe.co.uk and http://dynapipe.co.uk.
This doesn't happen with FF3 or IE7, 8 or 9 or Google Chrome, only FF4

Oops, responded to a duplicate of your post over here: https://support.mozilla.com/en-US/questions/814715

Why Does my site look different on my computer

My site, www.aaronapter.com, looks completely different on my computer than when I view it on another computer. It actually looks like my browser is accessing the files from my HD instead of the internet. Any ideas why? I ask because I want to fix some errors on my published site, such as a fonts appearing differently and the spacing of a page being totally messed up. Again, this doesn't happen when I view it on my computer, but it does on others. Any help? I'm using iWeb '08.
Message was edited by: 2A Batterie

Is it just fonts? If so, the challenge is that you're using fonts that are only on your system and not others. There's a bit of a tricky fix but it'll force fonts to be graphics.
I'm not too sure about this approach but it seems simple enough: http://podcast.eusd4kids.org/groups/teacherresources/weblog/a91d4/iWeb__fonts_displayed_asgraphics.html
This appoarch is a tad trickier but I found it easy:
http://11mystics.com/2007/09/12/how-can-i-ensure-the-fonts-i-use-will-look-good- on-a-pc/
In short, go to Applications, control-click on iWeb and choose Show Package Contents. Then open Contents, then Resources, and then double-click on FontMapping.plist. Look for the special font that you're using and change false/ to true/like this:
<key>AmericanTypewriter</key>
<dict>
<key>Generic</key>
<string>serif</string>
<key>Image</key>
<true/> <=== change this from false/ to true/
<key>Windows</key>
<string>Courier New</string>

Why does my lists look different in Firefox

Please take a look at the following pages in both browsers. pay attention to the right column and see the lists. In firefox they are ok but explorer does not show the same thing. any suggestions?
http://greenpwwhh.com/wisdom.html
http://www.greenpwwhh.com/wealth.html
http://www.greenpwwhh.com/health.html
codes for health page: note that style in blue was used to take care of margin space for bullets.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>GreenP - Wealth, Wisdom, Health & Happiness</title>
<style type="text/css">
ul {padding-left:16px}
</style>
<style type="text/css">

</style>

<link href="main_page.css" rel="stylesheet" type="text/css" />


<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">

</script>
<script type="text/javascript" src="diva/divaCommon.js"></script>
<script type="text/javascript" src="diva/divaGPSfree/divaGPSfree.js"></script>


</head>
<body class="thrColFixHdr">
<div id="container">
<div id="header">
    <div id="headerLogo"><img src="greenP_logo.gif" width="293" height="90" alt="logo" /></div>
    
    <div id="headerAd"><a href="http://www.patrickgreen.cruiseshipcenters.com/Home.aspx#"><img src="cruiseshipcenter_728x90.gif" width="728" height="90" alt="cruise" /></a></div>
    
    <h1> </h1>
    
</div>
<div id="nav">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="index.html" class="thrColFixHdr">Home</a></li>
      <li><a href="wisdom.html" target="_top" class="thrColFixHdr">Wisdom</a></li>
      <li><a href="wealth.html" class="thrColFixHdr">Wealth</a></li>
      <li><a href="health.html" class="thrColFixHdr">Health</a></li>
      <li><a href="happiness.html" class="thrColFixHdr">Happiness</a></li>
      <li><a href="#" class="thrColFixHdr">Opportunities</a></li>
      <li><a href="#" class="thrColFixHdr">Seminars</a></li>
      <li><a href="#" target="_top" class="MenuBarItemSubmenu">Store</a>
        <ul>
          <li><a href="Books.html" target="_top">Books</a></li>
          <li><a href="posters.html" target="_top">Posters</a></li>
        </ul>
      </li>
      <li><a href="#" class="thrColFixHdr MenuBarItemSubmenu">Stress Release</a>
        <ul>
          <li><a href="crossword_main_page.html">Crossword</a></li>
          <li><a href="jigsaw_things.html">Jigsaw</a></li>
        </ul>
      </li>
<li><a href="advertising.html" class="thrColFixHdr">Advertise</a></li>
<li><a href="membership.html" class="thrColFixHdr">Members</a></li>
      <li><a href="about_us.html" class="thrColFixHdr">About us</a></li>
    </ul>
</div>
<div id="search">
<form name="fbsearch" method="get" action="http://ss662.fusionbot.com/b/q" style="margin:0;">
<div align="left"><font size="2" face="arial"><a href="http://www.fusionbot.com" target="_blank">Site Search</a>:</font>
    <input type="text" name="keys" size="15">
    <input type="submit" value="GO">
    </div>
    <input type="hidden" name="sn" value="160516902">
</form>
</div>
<div id="nav2"><a href="http://pub27.bravenet.com/chat/show.php?usernum=2253679465&cpv=2"><img src="_image/Chat-with-friends-&-network.gif" width="173" height="25" alt="chat" /></a><a href="http://pub27.bravenet.com/calendar/show.php?usernum=2253679465"><img src="_image/calendar_button.gif" width="173" height="25" alt="calendar" /></a><a href="http://pub27.bravenet.com/postcard/post.php?usernum=2253679465"><img src="_image/Send-Some-Love-Today.gif" width="173" height="25" alt="send some love" /></a><a href="comments.html"><img src="_image/Your-comments-please.gif" width="173" height="25" alt="your comments" /></a></div>
<div id="chat">
    
    <div align="center"></div>
    
</div>

<p> </p>
<div id="healthLeft">
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab" id="Player_259055d2-c397-4de3-a156-df6e49cfcab4" WIDTH="300px" HEIGHT="250px"> <PARAM NAME="movie" VALUE="http://ws.amazon.com/widgets/q?ServiceVersion=20070822&MarketPlace=US&ID=V200708 22%2FUS%2Fgreenpwwhh-20%2F8003%2F259055d2-c397-4de3-a156-df6e49cfcab4&Operation= GetDisplayTemplate"><PARAM NAME="quality" VALUE="high"><PARAM NAME="bgcolor" VALUE="#FFFFFF"><PARAM NAME="allowscriptaccess" VALUE="always"><embed src="http://ws.amazon.com/widgets/q?ServiceVersion=20070822&MarketPlace=US&ID=V200708 22%2FUS%2Fgreenpwwhh-20%2F8003%2F259055d2-c397-4de3-a156-df6e49cfcab4&Operation= GetDisplayTemplate" id="Player_259055d2-c397-4de3-a156-df6e49cfcab4" quality="high" bgcolor="#ffffff" name="Player_259055d2-c397-4de3-a156-df6e49cfcab4" allowscriptaccess="always" type="application/x-shockwave-flash" align="middle" height="250px" width="300px"></embed></OBJECT> <NOSCRIPT><A HREF="http://ws.amazon.com/widgets/q?ServiceVersion=20070822&MarketPlace=US&ID=V200708 22%2FUS%2Fgreenpwwhh-20%2F8003%2F259055d2-c397-4de3-a156-df6e49cfcab4&Operation= NoScript">Amazon.com Widgets</A></NOSCRIPT>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
</div>

<div id="healthMid">
    <p>health articles go here</p>
<p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
</div>

<div id="healthRight">
    <div id="healthVideos">
      <div id="healthVideoHead">Videos</div>
      <div id="healthvideoContent">
        <ul>
          <li><a href="ten best foods to eat.html" target="_top">10 best foods to eat</a></li>
          <li><a href="ten worst foods to eat.html" target="_top">10 worst food to eat</a></li>
          <li><a href="ten worst drinks.html" target="_top">10 worst drinks</a></li>
          <li><a href="whole foods and weight loss.html" target="_top">Whole foods & weightloss</a></li>
          <li><a href="super foods.html" target="_top">Super foods</a></li>
          <li><a href="sugar effects 1.html">Sugar is very bad 1</a></li>
          <li><a href="sugar effects 2.html">Sugar is very bad 2</a></li>
          <li><a href="mother of all illness.html" target="_top">Mother of your illness</a></li>
          <li><a href="meat or vegetables.html" target="_top">Meat or vegetables</a></li>
          <li><a href="healthy ways to lose weight.html" target="_top">Healthy weightloss</a></li>
          <li><a href="food for the mind.html" target="_top">Food for the mind</a></li>
          <li><a href="fiber facts.html" target="_top">Fiber facts</a></li>
          <li><a href="fiber fakes.html" target="_top">Fiber fakes</a></li>
          <li><a href="life saving food tips.html">Life-saving food tip</a></li>
        </ul>
        <p> </p>
        <p> </p>
      </div>
      <div id="healthArticles">
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
      </div>
      <div id="healthResources">
        <div id="healthResourceHead">Resources</div>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
        <p> </p>
      </div>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
    </div>
    <p><a href="ten worst foods to eat.html" target="_top"></a></p>
    <p> </p>
    <p> </p>
</div>
<div id="healthFooterAd">Content for id "healthFooterAd" Goes Here</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<br class="clearfloat" />
<div id="footer">
    <p>Copyright © GreenP. All rights reserved. Site designed by Patrick L Green</p>
    
</div>

</div>
<script type="text/javascript">

</script>
</body>
</html>

Hi
They are different because of the way IE/Opera and FF/Safari handle list indents, you will have to change the default margin and padding values to achieve a consistent list positioning, (do not forget negative values are allowed).
See the section on positioning in this article for more info - http://www.alistapart.com/articles/taminglists/.
PZ

Why does my page look great in design view and to the left in live view?

I just created a new page using a fluid grid layout and in "design" view it looks great but in "live" view or on a browser preview the wording all goes to the left. What I am doing wrong? I also have another question which may relate to the first. I have four templates. Do I create a new named .css file for each new template or continue using the same layout.css file for all templates? Since I created a new .css file for every template maybe it is causing confusion. Thanks in advance.

If this is what you want, rework your HTML so all three images are in the same div and adjust your css to narrow the scroll down image and on Order jpg, vertically align top, 30px margin.
<div id="header">
<div id="pic1">
<img src="Thumbs/Scroll-Down.jpg" alt="More Pictures">
<img class="goldborder" src="NewImages/englilshivymain.jpg" alt="">
<a href="#OrderHere2">
<img alt="Order Here" src="Thumbs/OrderHere.jpg">
</a>
<br>
English Ivy (Detail)
</div>
<div id="pic4">

Why does my clip look different in Color vs FCP via External mmonitor

Can anyone explain why my clip look slightly different in color as opposed to FCP. This clip is exported from FCP sequence with NO filters whatsoever. I'm basically viewing the same clip and switching between color and FCP. The clip seems to have a tad more highlight when viewing in color
I'm using a MacPro/Kona3/Sony Multiformat CRT. Thanks

seems to have a tad more highlight when viewing in color
Do you see a difference in the scopes? "seems to" is not as good a description as we really need to sort out whether this is a gamma issue or a possible 601/709 conflict, even with your Multiformat Sony. There appear to be a lot of RGB, Y'CbCr conversions in your image pipeline.
I am aware that some codecs are handled slightly differently by Final Cut and COLOR. They do not use the same media decoding engine. COLOR's is much more basic (fundamental) and generally speaking is more accurate for that reason. Similar to SHAKE in that respect.
jPo

Why does Firefox 4 look different on xp than Win 7. Some of the features described in the intro are not showing up like the firefox button top left.

When I loaded the new version on my office computer running Win 7 it looked like the promo but when I upgraded my other computers running xp it looks more like the earlier versions. What is the story people!!!

Try turning off the menu toolbar
* Use keyboard keys '''Alt''' then in turn '''V , T , M'''
Note the menubar may be temporarily turned back on by using the Alt key even if the '''orange''' ''"Firefox Button"'' is displayed.
Firefox 4 probably by default does not dislplay the bookmarks toolbar, and will display the Tabs on top.
There are other changes; and some users do not like them, but in most cases firefox 4 can be made to look and work like firefox 3.6 if required.

Why does the display look different in photoshop and lightroom

I am using CS4 and LR2.1. When I open the same picture in both programs the picture in CS4 looks dull and washed out. My color space in both programs is srgb (I send all my pictures to Miller's for printing). Any Idea why and what setting I should adjust.
Thank you in advance for your help,
Allen
Edit/Delete Message

Your color settings are not the same, or something is broken with your display profile that one application is trying to fix up (but that should give you a warning).

Why does my site look different when I FTP it?

Hi -- I am doing a clean upload (All files) of my site to my BlueHost FTP site. Here is how it looks in Publish mode
http://thebigdivide.businesscatalyst.com/gift-shops-selling-the-big-divide.html
and here is how it looks on my site
http://thebigdivide.com/gift-shops-selling-the-big-divide.html
What is going on here? Is there a file I need to delete?

By gum that was it.
I have no idea how you figured that out but thanks.

Why does my site look different live?

When I preview my site in safari or mozilla and even live view, it looks exactly how I want it to look, but when I put the files up, it seems like there is no .css. Any help is much appreciated, thank you!
http://www.slzdesign.com/

Your link to the page did not work for me, I got a 404
You could start by a) checking that your style sheet has uploaded (if you have an external style sheet for your CSS) and/or that your link to the style sheet acurately reflects the file's location i.e. that the path is correct.
Martin

Why does my footage look different in final cut than in color?

when i render in color and send back to final cut, the color grades don't look the same back in final cut as they do when i view them in color. any ideas why?

Mostly because COLOR is setup to work in 709 space and preview the correct gamma setting of 2.2 for legitimate broadcast use.
Quicktime and Final Cut make an assumption that you're using a graphics monitor for preview and uses a gamma setting of 1.8. This is a fundamental error and incompatibility.
Apparently Snow Leopard is supposed to address this issue.
jPo

Why does my dock look different than normal ML docks

Hi, I upgrade to ML and over time my dock started to look diffrent, it has two indicator lights instead of a line, can you help me, thanks.

I kinda like it the way you have it - it's easier to see the lights that way. Still, if you insist on getting rid of it...
Assuming this behavior survives a restart, a standard thing to try is to trash the Dock preferences. You will have to repopulate your dock afterwards.
The files start with com.apple.dock and are found in ~/Library/Preferences.
You can get to your home LIbrary via the Finder Go menu if you press the option key and select Library. The preference files are then in the Preference subfolder, and in the Preferences/ByHost subfolder.
To get the changes to take effect you will have to relaunch the dock, e.g., by quitting it in Activity Monitor or by logging out/in.
Hope this helps.
charlie

Team Blog: Why does my page look different in BrowserLab?

Similar Messages

Maybe you are looking for