Aligned in Firefox but not in IE.

I'm a complete newbie to webdesign have a wee problem.  Whilst designing a website I was testing totally out of firefox, website goes live and check it at
work... not aligned.  Can anyone help?
Have posted the code below.
Huge thanks to anyone inadvance.
Fen
Edited - Cos I some linked the webpage not the code.
<!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=iso-8859-1" />
<title>Scorrier House Cross Country Course</title>
<style type="text/css">
<!--
body {
     background-image: url(Images/background_047.gif);
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 12px;
     line-height: 18px;
a {
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 14px;
     text-decoration: none;
     color: #000000;
a:hover {
     font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 14px;
     font-weight: bold;
     color: #000000;
     text-decoration: none;
div{
margin: auto;
-->
</style>
</head>
<body>
<table width="101%" height="100%" border="0">
  <tr>
    <td width="180" height="0">&nbsp;</td>
    <td width="460" height="1000" valign="baseline" bgcolor="#FFFFFF"><table width="100%" border="0">
      <tr>
        <td><a href="/index.html"><img src="Images/place holder.JPG" width="900" height="150" border="0" /></a></td>
      </tr>
    </table>
      <table width="100%" border="0">
        <tr>
          <td width="100"><div align="center" class="a"><a href="index.html" class="a">Home</a></div></td>
          <td width="100"><div align="center" class="a"><a href="/jumps.html" class="a style1">Jumps</a></div></td>
          <td width="100"><div align="center" class="a"><a href="/course.html" class="a style1">Course</a></div></td>
          <td width="100"><div align="center" class="a"><a href="/prices.html" class="a style1">Prices</a></div></td>
          <td width="100"><div align="center" class="a"><a href="/location.html" class="a style1">Location</a></div></td>
          <td width="100"><div align="center" class="a"><a href="/contact_us.html" class="a style1">Contact us</a></div></td>
        </tr>
      </table>
      <table width="100%" border="0" cellpadding="20" cellspacing="0">
        <tr>
          <td><p>&nbsp;</p>
          <p>&nbsp;</p></td>
          <td><div align="center"><img src="Images/horses 048.JPG" width="700" height="450" /></div></td>
          <td>&nbsp;</td>
        </tr>
      </table>
      <blockquote>
        <p>Welcome to Scorrier House cross country course.  The course is in the breathtaking Cornish countryside, set in rolling farmland  and woodland. </p>
        <p>The course is just over two miles long and  securely fenced. Due to a good grass covering, we have a good going all year  around. </p>
        <p>With a vast range of jumps and open fields,  it is ideal for schooling, or simply hack around in a relaxed atmosphere taking  in the beautiful countryside. All of our jumps have options to avoid them, so  you can jump as much or as little as you wish. There is also plenty of flat space to warm up in. </p>
        <p>We are ideally situated, just a short distance  from the A30. Once you arrive at the course, there is plenty of parking with  some hard standing.&nbsp;</p>
        <p>&nbsp;</p>
      </blockquote></td>
    <td width="180">&nbsp;</td>
  </tr>
</table>
</body>
</html>

Try pasting this code into a new, blank HTML document in Code View.
<!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=iso-8859-1" />
<title>Scorrier House Cross Country Course</title>
<style type="text/css">
body {
background-image: url(Images/background_047.gif);
font-family: Verdana, Arial, Helvetica, sans-serif;
width: 900px;
margin: 0 auto;/**centers page**/
text-align: center; /**centers page in older browsers**/
font-size:90%;
p {
font-size: 0.8em;
line-height:1.3em;
text-align:left;
padding: 0 6em 0.5em 6em;
margin: 0  0 0.5em 0;}
/**links**/
a {font-size: 14px;text-decoration: none;}
a:link {color:#000;}
a:visited {color:#0033CC;}
a:hover, a:active, a:focus {font-weight:bold}
/**menu**/
.menu td { text-align: center; width: 100px;}
</style>
</head>
<body>
<table width="100%" border="0">
<tr>
<td><a href="/index.html"><img src="Images/placeholder.JPG" alt="placeholder" width="900" height="150" border="2" /></a></td>
</tr>
</table>
<table class="menu" width="100%" border="0">
<tr>
<td><a href="index.html">Home</a></td>
<td><a href="/jumps.html">Jumps</a></td>
<td><a href="/course.html">Course</a></td>
<td><a href="/prices.html">Prices</a></td>
<td><a href="/location.html">Location</a></td>
<td><a href="/contact_us.html">Contact us</a></td>
</tr>
</table>
<table width="100%" border="0" cellpadding="20" cellspacing="0">
<tr>
<td><div align="center"><img src="Images/horses048.JPG" alt="horses" width="700" height="450" border="2" /></div></td>
</tr>
</table>
<p>Welcome to Scorrier House cross country course.  The course is in the breathtaking Cornish countryside, set in rolling farmland  and woodland. </p>
<p>The course is just over two miles long and  securely fenced. Due to a good grass covering, we have a good going all year  around. </p>
<p>With a vast range of jumps and open fields,  it is ideal for schooling, or simply hack around in a relaxed atmosphere taking  in the beautiful countryside. All of our jumps have options to avoid them, so  you can jump as much or as little as you wish. There is also plenty of flat space to warm up in. </p>
<p>We are ideally situated, just a short distance  from the A30. Once you arrive at the course, there is plenty of parking with  some hard standing.</p>
</body>
</html>
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media  Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

Similar Messages

  • Ul Menubar Positions Correctly in Firefox but NOT in IE

    Hi I am having problems with my ul menubar. It displays correctly in dreamweaver and firefox but not in IE 9. Below are screenshots of what im trying to achieve. I placed the ul menubar where i want it (horizontally dropping down rather than vertical) and made its position absolute but for some reason IE does not like this. If there is anyone out there who would be willing to help me i would me most grateful!! Im relatively competent with dreamweaver cs5.5. Much thanks!
    Here is Firefox working properly:
    Here is Internet Explorer not working properly:
    Here is the menubar code:
      <td height="27" align="right" nowrap="nowrap"><ul id="MenuBar1" class="MenuBarHorizontal">
        <li><a class="MenuBarItemSubmenu" href="../html/index.html">links</a>
          </li>
        <li><a href="../html/portfolio.html">contact</a>      </li>    
        <li><a class="MenuBarItemSubmenu" href="../html/profile.html">profile</a></li>
        <li><a href="../html/contact.html" class="MenuBarItemSubmenu">projects</a>
          <ul>
            <li><a href="#">industrial</a></li>
            <li><a href="#">institutional</a></li>
            <li><a href="#">commercial</a></li>
            <li><a href="#">residential</a></li>
            <li><a href="#">award winning</a></li>
          </ul>
        </li>
        <li><a href="../html/links.html">home </a></li>
      </ul></td>
    Here is the menubar script:
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    clear: right;
    float: right;
    position: relative;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
    z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: pointer;
    width: 80px;
    float: right;
    height: 27px;
    text-align: right;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    position: absolute;
    left: -1000em;
    top: 27px;
    display: inherit;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: -200px;
    top: 27px;
    position: absolute;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
    width: 120px;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
    height: 27px;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
    display: block;
    background-color: #FFF;
    color: #003366;
    text-decoration: none;
    height: 17px;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    text-transform: lowercase;
    vertical-align: middle;
    padding-top: 5px;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    background-color: #FFFFFF;
    height: 17px;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    color: #FF9900;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    background-color: #FFFFFF;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-repeat: no-repeat;
    background-position: 95% 50%;
    height: 17px;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
    height: 17px;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: right;
    background: #FFF;

    Spry Menus 10 Commandments
    http://www.dwcourse.com/dreamweaver/ten-commandments-spry-menubars.php
    Fixing Spry Menus 1.6.1
    http://www.projectseven.com/testing/adobe-bugs/spry-menus/
    That said, Adobe abandoned the Spry framework and you may want to do the same. 
    http://blogs.adobe.com/dreamweaver/2012/08/update-on-adobe-spry-framework-availability.htm l
    Nancy O.

  • Images Viewable in Firefox But Not In Explorer, Safari, Chrome.

    I have a coldfusion page with images. The images are called up dynamically from my Mysql database. The image field with my database has the datatype "char(100)". All that is stored in that database field is the file path to the folder of which the image is stored which is: \photos\RSL\1.jpg.
    On my webpage, the image placeholder looks like this:
    <a href="#Unit_Info.comphoto1#"><img src="#Unit_Info.comphoto1#" alt="" name="1" width="98" height="73" /></a>
    This images display just fine on Firefox, But Not In Explorer, Safari, & Chrome. These latter three just show a broken image. Could there be something wrong with either my coldfuson or Mysql file path where each of the letter three browsers are trying to access?
    I'm running Coldfusion 9 on my local machine, using OS Window 7 Professional.

    When I hard coded the file path it worked. I checked the source code and saw no white space. I even went to each browser's options dialog box to make sure that the show image options were checked. It may be my coding. In my image folder there are categories  of other folders within folders that have images of which Coldfusion calls up whenever the browser needs it. Could that be the problem? Should I have all of my 300 images in one folder?
    - Hannibal Hasan
    On Sep 1, 2011, at 9:30 PM, Dan Bracuk <[email protected]> wrote:
    First thing I'd try would be to hard code the expected value and see if that works.  If it does, I'd look at the html source code from the problematic browsers and see if there is any unexpected white space.
    This message was sent to: College Kid
    Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: http://forums.adobe.com/message/3897548#3897548
    To unsubscribe from this thread, please visit the message page at http://forums.adobe.com/message/3897548#3897548. In the Actions box on the right, click the Stop Email Notifications link. For more information about unsubscribing from the Adobe Forums, please visit http://kb2.adobe.com/cps/522/cpsid_52211.html
    --end--

  • Images show up on Firefox but not IE after upgrade from 8.1 to 9.2

    Hello,
              <p>
              We are encountering a strange situation: we upgrade our Weblogic 8.1 Application to 9.2. The images on the login page can be properly displayed on Firefox, but not in IE.
              <p>
              In order to make the images show up on IE, we have to modify the image path by adding extra two "//". For example:
              <p>
              We have to change
              <p>
              < img src="/resources/images/logo.gif" .../>
              <p>
              into
              <p>
              < img src="///resources/images/logo.gif" .../>
              <p>
              to make it works in IE, however, in that case, the Firework won't work.
              <p>
              We do notice that the file structure has been changed by the upgrade:
              <p>
              File structure of Weblogic 8.1 Application Web Module "golWeb"
              <p>
              <p>
              golWeb
              <p>
              * jsps folders
              <p>
              * resources
              <p>
              >> resources/images
              <p>
              >> resources/jsps
              <p>
              * WEB-INF
              <p>
              File structure of Weblogic 9.2 Application Web Module "golWeb"
              <p>
              <p>
              golWeb
              <p>
              * WebContent
              <p>
              -- jsps folders
              <p>
              -- resources
              <p>
              >>> resources/images
              <p>
              >>> resources/jsps
              <p>
              -- WEB-INF
              <p>
              <p>
              It seems that only the first login page has such issue. Could anyone help us with this issue? We totally have no clues now.
              <p>
              Thanks for the help!
              <p>
              Agnes

    Agnes,
              I think you should distinguish whether it is a behavior difference between
              two browsers or it is an issue of WLS server.
              You can copy suspicious html codes into a dependent html file, then check
              how is is rendered by different browsers.
              If you have further issues, please add commnets here.
              Regards
              Leon
              <Agnes Chen> wrote in message news:[email protected]...
              Hello,
              <p>
              We are encountering a strange situation: we upgrade our Weblogic 8.1
              Application to 9.2. The images on the login page can be properly displayed
              on Firefox, but not in IE.
              <p>
              In order to make the images show up on IE, we have to modify the image path
              by adding extra two "//". For example:
              <p>
              We have to change
              <p>
              < img src="/resources/images/logo.gif" .../>
              <p>
              into
              <p>
              < img src="///resources/images/logo.gif" .../>
              <p>
              to make it works in IE, however, in that case, the Firework won't work.
              <p>
              We do notice that the file structure has been changed by the upgrade:
              <p>
              File structure of Weblogic 8.1 Application Web Module "golWeb"
              <p>
              <p>
              golWeb
              <p>
              * jsps folders
              <p>
              * resources
              <p>
              >> resources/images
              <p>
              >> resources/jsps
              <p>
              * WEB-INF
              <p>
              File structure of Weblogic 9.2 Application Web Module "golWeb"
              <p>
              <p>
              golWeb
              <p>
              * WebContent
              <p>
              -- jsps folders
              <p>
              -- resources
              <p>
              >>> resources/images
              <p>
              >>> resources/jsps
              <p>
              -- WEB-INF
              <p>
              <p>
              It seems that only the first login page has such issue. Could anyone help us
              with this issue? We totally have no clues now.
              <p>
              Thanks for the help!
              <p>
              Agnes

  • Why does the FP 10 work with firefox but not with IE8

    I down loaded the folowing for xp FP uninstall, FP plugin and FP debug from the link in one of your replys. now I can watch youtube  with firefox but not with IE8. you asked me before if i was using 16 bit. whats that mean and how do I find out? please help I just want to watch youtube on IE!

    Ok Shag, since you hadn't been on a Forum before, then I'll take some of what I said back:-) I wanted you to stay on one thread, you can get in trouble trying things that may cause you more problems than you had in the beginning. I just had your best interest at heart
    I'll even overlook your all caps here:-) At least you responded
    Now since you say you fixed it, what you should do is to confirm it is fixed by taking a look at your Flash folder. This contains all of the Flash files for IE and FF. Then make sure you have the IE add on and the FF add on. That way if you have any future problems, at least you would know it is not the Flash Player.
    You should only have 2 .exe files for IE and 1 for FF.
    For Video editing, I would check Microsoft and see what they have. Perhaps someone else will come along with other info for you.
    No, I don't get paid here, since I am not an employee. Just a user helping others, since I had a problem at one time and after 4 hours of researching solved it.
    Let me know if you want to check the Flash files.
    Thanks,
    eidnolb

  • Works in Firefox but not in IE

    I have a webpage that when published looks exactly how I want
    it to in firefox but not in Internet Explorer. The problem is it
    shows the bulleted list in Firefox but not in IE. How can I fix
    this?

    I do not now what the function of this declaration is, but
    please remove this from the beginning your css and IE7 also shows
    bullets:
    margin: 0;
    padding: 1;
    The padding: 1; is definitely an error cause there should be
    at least something like px behind the 1, so like padding:
    1px;

  • V 3.2 v2 now has problems with layouts, displays images fine in IE10, Firefox but not in Chrome...

    Images placed in a page are not displaying in the same places in the design view on the rendered Chrome page, they are perfect in IE 10 and Firefox but not chrome / safari (ipad)?
    In other words I cant get all the browsers to render the same, in order to get one set to work I have to position images one way and then they dont work in the other browsers? it doesnt make much sense but i cant seem to figure it out and need urgent help!
    see here: http://www.nalpeiron.com/--analytics-solutions-by-role--.html
    this has been setup to work with chrome, but in the design view you have to place the images in totally wrong places to get them to show correctly....
    if you review in ie/firefox you can see the problem!
    Ideas?

    Every browser will potentially line break the same text with the same formatting differently due to subtle differences in the text layout engines between browsers, so the inline graphic approach is generally the best approach for achieving completely reliable results.
    The reason the difference was so dramatic between IE or Firefox versus Chrome or Safari is that Chrome and Safari are based on Webkit and Webkit rounds percentage leading to a whole pixel value where as IE and Firefox interpret percentage leading as a fractional pixel amount, if necessary. This means line spacing for text with leading that's specified as a percentage will be substantially different between IE/Firefox and Chrome/Safari. You can avoid this by entering a pixel value (i.e. "14 px" for leading in the Control Strip or Text panel in Muse.

  • How do I set a specific page to open when I open a new tab in Firefox? I can open the page when initially opening Firefox, but not for subsequent tabs/pages.

    How do I set a specific page to open when I open a new tab in Firefox? I can open the page when initially opening Firefox, but not for subsequent tabs/pages.

    You can use an extension to set which page to open in a new tab:
    *NewTabURL : https://addons.mozilla.org/firefox/addon/newtaburl/
    *My Homepage: https://addons.mozilla.org/firefox/addon/my-homepage/

  • After uninstalling and downloading the latest Abobe Flash player, I can no lnger play youtube videos. I get the message "blocked plug-in". It works in Firefox, but not Safari.

    After uninstalling and downloading the latest Abobe Flash player, I can no lnger play youtube videos. I get the message "blocked plug-in". It works in Firefox, but not Safari?

    Frostbitblue,
    in Safari’s Preferences, select its Security tab, and make sure that its “Internet plug-ins: Allow Plug-ins” checkbox is checked.

  • Published module (.swf) will play in Firefox but not IE

    Please help…
    Does anyone know why a .swf file would play fine in Mozilla Firefox, but not load at all in Internet Explorer?   I have six of these that I’ve uploaded to our intranet production server (where they should work fine).  They all play fine in Firefox.  In IE I get a blank screen that just hangs forever.  I don't even get the loading screen (which plays correctly in Firefox.) They are published with Captivate 4 for Flash 8.  I am using IE 7 with Flash 10 on Windows XP to try to play them.  I’ve Googled the problem and searched the Captivate forums and can’t find anything on this.
    This is a major problem for us, as our company standard is IE and these training modules are intended for all staff.   We were hoping to roll them out to all staff next week.  Could this be something that is local to my machine (which is new)?   If so, how do we troubleshoot it to make sure it won’t happen to other users in the field when we roll this training out?
    The modules play in IE fine from my local hard drive.   I've also modified my IE and Flash settings to list the sites as trusted sites and always allow content.
    I've got to get this figured out ASAP... any suggestions would be appreciated!
    Thanks.
    Toni R

    IE - I have version 10,1,102,64 installed
    Firefox - I have version 10,1,85,3 installed
    I followed two sets of instructions. One related to the putting FakeFlash.exe in the ExecutablePublish folder. However, that didn't fix the problem I was experiencing. Then I Followed instructions from:
    http://blogs.adobe.com/captivate/2010/11/solution-for-cp5-content-not-working-with-the-lat est-flash-player-version.html
    which told me to replace the  CPAnimationUtils.dll file in the installations folder.
    This did correct my problem.
    Betsy

  • Flash buttons work in FireFox but not IE

    Please can someone please take a look and see if they can
    figure it out cos i can't!
    roundshaw (dot) co (dot) uk
    The increase and decrease flash buttons at the top of the
    page works ok in FireFox but not in Internet Explorer.
    Can anyone see what i have missed that stops it working in
    IE?
    thanks in advance for your help.
    Jason

    Hello again,
    Yep, sounds like you've got the general idea.
    hries22 wrote:
    I'm going to start from scratch and give it another go...would you reccomend converting every button to a symbol? Then give the symbols  a mouseover, click, and mouseout?
    I'd take all the elements that make up the button, and convert that into a symbol. Then you can go to labels with your code without worrying about the main timeline. Put all your code on the elements themselves, and not on the symbol instance.
    hries22 wrote:
    Also - and this minor - but is there a way to get a button's mouseover area to recognize transparency? For instance - I'll use a .png with transparency for a button...let's say the T-shirt. I want the mouseover to activate only when the mouse is over the t-shirt, and not over the transparent area around the t-shirt...any thoughts?
    By default, the hit area of a div in HTML is its bounding box. Right off the top of my head, I'm not sure there's a way to change it...maybe someone else can chip in?
    EDIT: here's an old-school way...could be a lot of work: http://www.svennerberg.com/2008/09/imagemap-rollover/
    hth,
    Joe

  • My bulleted list displays correctly in IE 8 and Firefox, but not in IE 7

    I have a simple bulleted list in a right floated sidebar for a website. If views fine in IE 8 and Firefox, but not in IE 7 (and perhaps earlier, though I only have access to machines with IE 7 and 8.
    Because the default indent for the bulleted list moves it too far to the right, I set a negative margin for that area of text in order to move it to the left a little. While it looks great in IE 8 and Firefox, it appears this margin setting is causing the bulleted list to shift too far to the left in at least IE 7. The rest of the copy in the sidebar div lookes fine including the title and paragraph copy.
    Can anyone suggest a fix?
    Also, I noticed the spacing above the main content div is smaller in IE 7 than with the IE 8 and Firefox. This div has a h1 heading followed by paragraphs. (This site was developed using a pre-existing CSS style sheet from Dreamweaver by the way.)

    Strangely when I replied via e-mail my message got garbled when I looked at it here.
    I was able to move over the bullet items to the left using your suggestion, however it now shows this line of copy above the page at the top of the window in the IE browser (both IE 7 and IE 8):
    <!--[if lte 7]>
    I'm including the code where you had indicated I should place it - in the <head> section after the link to the main stylesheet. I included it just after the other conditional comments. Perhaps I've included it in the wrong place - hence the line appearing above the pages (just above the banner)?
    I did not change any other parameter. (This is a template page as all pages in the site are based on it.) The list feature does appear on a number of pages.
    Also I should note the bullets have mysteriously disappeared and it's actually an unbulleted list in IE 7, which I could live with if I have to.
    <!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" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Home Page</title>
    <!-- TemplateEndEditable -->
    <link href="../css/twoColFixRtHdr.css" rel="stylesheet" type="text/css" /><!--[if IE 5]>
    <style type="text/css">
    /* place css box model fixes for all versions of IE in this conditional comment */
    .twoColFixRtHdr #sidebar1 { width: 190px; }
    </style>
    <![endif]--><!--[if IE]>
    <style type="text/css">
    /* place css fixes for all versions of IE in this conditional comment */
    .twoColFixRtHdr #sidebar1 { padding-top: 10px; }
    .twoColFixRtHdr #mainContent { zoom: 1; }
    /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
    </style>
    <![endif]-->
    <!--[if lte 7]>
    <style>
    .twoColFixRtHdr #container #sidebar1 ul {
    margin-left: 25px
    </style>
    <! [endif]-->
    <style type="text/css">
    <!--

  • Cure for "501 Method Not Implemented" error at site in Firefox but not Chrome or IE?

    I am receiving a "501 Method Not Implemented" error message at a site in Firefox but not in Chrome or IE. How can this be cured?

    Do you get that error if you access the site or if you click a link to got to another page?
    You can reload the page and bypass the cache with:
    * Press and hold Shift and left-click the Reload button.
    * Press "Ctrl + F5" or press "Ctrl + Shift + R" (Windows,Linux)
    * Press "Cmd + Shift + R" (MAC)
    See [[Keyboard shortcuts]] and [[Mouse shortcuts]]
    * "Clear the Cache": Tools > Options > Advanced > Network > Offline Storage (Cache): "Clear Now"
    * "Remove the Cookies" from sites that cause problems: Tools > Options > Privacy > Cookies: "Show Cookies"
    Start Firefox in [[Safe Mode]] to check if one of your add-ons is causing your problem (switch to the DEFAULT theme: Tools > Add-ons > Themes).
    * Don't make any changes on the Safe mode start window.
    See [[Troubleshooting extensions and themes]] and [[Troubleshooting plugins]]

  • Rollovers & actions work in Firefox but not IE

    Hello,
    The site www.lamps-on-line.com has rollovers and actions created a few years ago in GoLive and now these effects only work in Firefox, but not in Interenet Explorer (IE7), which displays page errors.  Is there a way to fix this? I acknowledge that the site needs replacing but while it's still running my client wants it fixed.
    I set up a test page at www.lamps-on-line-com/test.html in which I took off all rollovers and actions, and this loads OK but I really don't want to have to resort to doing this on every page.
    I wondered if it is somrthing to do with 'Doctype'?
    Hope someone can help.
    Stephen

    Hytrical wrote:
    The site www.lamps-on-line.com has rollovers and actions created a few years ago in GoLive and now these effects only work in Firefox, but not in Interenet Explorer (IE7) which displays page errors.
    I didn't see any errors when I looked at yourhome page in IE7 (on Vista). So which page elements were producing an error and what was the error you were seeing? Did you delete the cache in IE7 to check whether it was a caching problem? Tools > Internet Options > Browsing history (choose to delete)?
    John

  • When uploading videos to iWeb, the video screen gets cut off at the top. It only happens in Firefox, but not in Safari.

    When uploading videos to iWeb, the video screen gets cut off at the top. It only happens in Firefox, but not in Safari. Has anybody else had this problem?

    I'm using pure HTML5 for mobile websites although you need to provide an OGG file for Firefox. See the movie page on this site...
    http://mobile.ezmacwebdesign.com/
    If you don't have an iPhone, grab the browser handle and drag it to the left to reduce the width to see how it responds to mobile devices' fixed width browsers .
    This will play in all modern browsers and on mobile devices. You can use QuickTime Pro for the OGG or OGV conversion or get the freeware Miro Video Converter...
    http://www.iwebformusicians.com/Website-Movie-Video/Easy-Movie-Player.html
    If you only want to upload an MP4, you can use a flash fallback player and this will cover Firefox and those geriatrics that still use older versions of Internet Explorer....
    http://www.iwebformusicians.com/Website-Movie-Video/Flow-Player.html
    http://www.iwebformusicians.com/Website-Movie-Video/Fallback-To-Flash.html
    http://www.iwebformusicians.com/Website-Movie-Video/JW-Media-Player.html
    If you use any of the four fallback players above, take advantage of the fact that you can add a poster image and stop the video file from preloading. This makes for a faster page download time.
    You can also achieve this using HTML5 by adding preload="none" and poster="URL to the poster image" into the code shown on this page...
    http://www.iwebformusicians.com/Website-Movie-Video/HTML5-Video.html

Maybe you are looking for