Problem with IE CSS

Similar Questions

• problem with a css option and exporting images

  I looked for an answer to this small inconvenience for days that maybe someone can help out me?

  on the adobe tv section States Jim Babbage around the 12:00 mark that you can export EVERYTHING using the css and images-exporter like when using the option.you export html and images can be seen here:

  http://TV.Adobe.com/#VI+f1594v1010

  My problem is the check box for "current page only" is grayed out that so always check if I'm unable to export all pages at once in the option "css and images".

  I tried setting my preferences, and searching the forum and came up empty. does anyone know how to access this option?

  This occurs only in the css and images export option not in other export options that allow all pages to export at the same time.

  It is a nuisance minor I know but I would really only my programs work as they are supposed to (asking too i know, I know, but we can always hope!)

  Thanks in advance!

  is attached a comparison side by side (mine & adobe)

  In fact, the link you posted is from video of James Williamson.  To any

  rates of these videos have been created - including my own - that we used

  beta versions of the software, and sometimes features in the beta

  are not in the final version. This is the case for the multi-page

  exporting CSS and images. At some point in the beta version, it's a feature,

  but there were stability problems with the export of multiple pages for CSS

  and Images, so it has been removed during the FW THAT came out.

  There are other concerns I had with the export of several page to

  time, you ended up with a stylesheet for each page or incorporated

  styles for each page, which does not - IMO - a lot of sense. Defeats

  the purpose of a style sheet.

  HTH clearly things!

  Jim Babbage

  NewMedia Services

  http://www.newmediaservices.ca

  Partnership with Community MX-

  http://www.communitymx.com/author.cfm?cid=1036

  Adobe Community Expert

  http://www.Adobe.com/communities/experts/members/206.html

  Author - Lynda.com

  http://MovieLibrary.Lynda.com/authors/author/?aid=188

  Author: Peachpit Press

  http://www.Peachpit.com/store/product.aspx?ISBN=0321562879

• Problem with styles Css does not display mode live view or when I browse

  I use Mac OS x 10.6 and construction Web site with Dreamweaver CS5.  I sometimes create div tags no styles or rendering mode display live view or when I browse but showing in design mode. I looked in dreamwever faq and they speak not no projection in Design view to toggle the display styles. This isn't the problem because it is checked, and I tried to turn on and off and made no difference. I use the firefox browser.

  
  

  It happened before the other day too. But all my other pages of this website that I created in the same way the construction with DIV tags and css styles So, not sure what is the problem. Maybe someone has a suggestion here.

  
  

  Johanna

  http://johannabresnahan.com/CSS/jbstyles.CSS

  {Line 420 is missing a closing brace} for the rest of the style sheet is either misinterpreted, including rules #mm1thumb and #mm2thumb.

  #footer {}
  background-color: #263f64;
  Clear: both;
  float: left;
  height: 150px;
  Width: 881px;
  position: relative;
  do-family: "Lucida Sans Unicode", "Lucida Grande", without serif.
  do-size: 9pt;
  make-style: normal;
  line-height: 9pt;
  make-weight: normal;
  do-variant: normal;
  text-transform: none;
  color: #FFF;
  text-decoration: none;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  text-indent: 525px;
  } / * THIS CLOSING BRACE IS MISSING * /.

• a space problem with validation css

  Hi all

  I validate my CSS and received the following WARNING

  83

  . Header

  Containing an area of family names are cited. If quoting is omitted, all characters in space before and after the name are ignored and any sequence of characters of white space inside the name is converted to a single space.

  
  The site is designed with Dw CS4, so I don't know what to do with it.  I suspect that this means by giving me my one maincontent div background color, but there seems to be a white space that surrounds the content.  In any case, if Googlebot sees this as a problem my site may not be indexed.

  I'm new to this any help would be welcome.

  Hi westewell,

  You have posted this message in the Adobe BrowserLab forum, so I move to the Dreamweaver forum for an answer... but I think I know the cause of the problem.

  "Family names containing spaces must be quoted. If quoting is omitted, all characters in space before and after the name are ignored and any sequence of characters of white space inside the name is converted to a single space of. »

  This is warning refers to font family names as they are written in your CSS stylesheet. Family names that contain a space white/spaces between words must be enclosed in quotes. For example, you will receive the warning if your rule looks like this:

  . Header {}

  do-family: Georgia, Times New Roman, Times, serif;

  }

  When it should look like this:

  . Header {}

  do-family: Georgia, "Times New Roman", Times, serif;

  }

  If that doesn't help not solve your problem, please post a link to your page that generates the validation warning, or include your code in your response.

  Best regards
  Corey

  Post edited by: Corey@Adobe corrected typos

• Problem with html/css object in Muse

  I did a project Muse and use widgets, but when I try to measure with the html/css object provided by Muse, the preview works perfectly but when I put it on Business Catalyst, the changes disappeared and he is back to normal...
  What should I do to make the CSS works?

  I don't know how you managed to add css to Jotform. JotForm is broadcast via iframe. Not editable any it by the css on your side. Any change in appearance, you can do in the Online Form Builder · JotForm , non-personalized css.

  

  Well, if we talk in general. Muse never deletes the user code inserted into the head through the properties of the page. But I do not see any css custom in the source code of your website.

• Problem with Chrome CSS

  It's my HTML code:

  < table >

  <? PHP {? >}

  < b >

  < class td = "table_top_row" > <? PHP echo date ("m.d.y", strtotime ($row_re_issues ['issue_submit_date']));? >

  < table >

  < class td = "table_top_row" > <? PHP echo $row_re_issues ["issue_first_name"];? > <? PHP echo $row_re_issues ["issue_last_name"];? >

  < table >

  < class td = "table_top_row" > <? PHP echo $row_re_issues ["issue_type_list"];? >, table >

  < /tr >

  < b >

  < td colspan = "3" class = "table_bottom_row" > <? PHP echo $row_re_issues ["issue_description"];? >

  < /tr >

  <? PHP} while ($row_re_issues = mysql_fetch_assoc ($re_issues));? >

  < /table >

  CSS:

  {.table_bottom_row}

  make-style: italic;

  }

  This works in IE and Firefox, but not Chrome. Chrome, the text isn't italic.

  Thanks for any help.

  Try this way-

  TR.table_bottom_row td {}

  make-style: italic;

  }

  It should work in all browsers.

• Perhaps another problem with Css

  I think this is another problem with my CSS is applied because of a problem but I have really no idea.

  The site is Alliance of injuries. The problem is with the images in the middle of the page. They are supposed to be in three rows of 3-3-2, but for some reason some they just below the other. When I click on Home.css in the "View Source", it is titled 'Page not found' don't know why.

  Anyone who has any ideas I would appreciate it.

  Brad

  First thing - you must stop using filenames with spaces in them.  That can get you into trouble.  Use only letters, numbers, dash or underscore - nothing else.

  Next thing, the image and CSS links in this page (located at the root of the site) are all (except two) wrong links related document, for example,.

  If the page is already at the root of the site, there is no ".." as possible.  It is sure to cause you problems.  All these links need to be just like this one (which is correct)-
  (although the Home.CSS file does not appear on the server!)
  The reason why your images are displayed in a vertical table is that each of them is contained in a

  container with no specified width (was this width specified in the Home.css file does not exist?).  So that they appear along a horizontal line, you need to specify the width of the div and float tag he left.

• Dreamweaver CS3 problem with small fonts

  Hello
  
  I'm having a problem with the text that appears REALLY SMALL and illegible in CS3, when he seemed fine in Dw8. It seems equally well in all browsers.
  
  I talked to Adobe technical support, and they said something about my CSS file is not wrong. I looked, and nothing seems out of the ordinary.
  
  If it's a problem with my CSS file, would not look bad in the browser, so?
  
  Any suggestions?
  
  Ron

  Ron,

  Thanks for the example file. It's a bit complicated, so please bear
  with me.

  Up to DW8, DW making always targeted the most popular browser
  This time. For DW8, who was IE6. Traditionally, the most popular
  browser was the most popular because it was the best browser, but which
  is no longer valid. Thus, DW CS3 now target CSS 2.1. Note that DW
  not compatible with all of the CSS 2.1 specification, but what it supports following
  the spec.

  Your page doesn't have a DOCTYPE, so it renders in "quirks" mode in the
  browsers that I tested on WinXP (FF2, IE7, Opera9). DW renders
  This page in IE6, but DW CS3 quirks mode can't stand anymore in quirks mode.
  Put a DOCTYPE that is similar to the following in your page to see what I mean:

  " http://www.w3.org/TR/html4/loose.dtd" >

  The reason for which the font is so small is because of font size
  property to this rule:

  TD {}
  FONT-SIZE: 80%;
  }

  Your page has 4 levels of nested deep tables, so the 80% is made to the
  each level. I fixed that in DW CS3 by creating a stylesheet with this rule:

  TD {FONT-SIZE: 100%! important ;}}

  and applied it as a design-TIME Style sheet, you can be
  able to remove the 80% in total.

  Hope this helps,
  Randy

  > Here is a link to the page:
  > http://www.ualberta.ca/AICT/IMS/
  >
  > You should be able to download the source of the page, if you want...!
  >
  > Thanks in advance for your suggestions...

• problems with the titles of sensitive bootstrap css pages

  Hello

  To get a little more familiar with the concept of reagent and "bootstrap", I downloaded a boot-gen-4 data model. This comes with a lot of explanation, that is not the issue. My problem is that it seems as if I should add the title (my company) on each page I do. I thought that would be a set time in css (custom.css or bootstrap.css or...)

  No matter what I try I can't get my title is displayed on each site. Maybe I should strip the model of all the example pages, I know not (the only place to add your title (company name) seems to be in the index.html file.

  I have to admit that I'm not a css and still less specialist "bootstrap" etc., so maybe someone can give me some info that helps me understand a little better.

  And if this all sounds a little vague, let me know, I could send code or whatever is needed...

  Thanks in advance,

  Karin

  PS. I hope that this post ended up in the right forum...)

  It is not a bootstrap or emit css, it is an HTML element.

  The title is a pair of tags located on thesection of each page.

  (the tag on this page code is

  )

  For SEO purposes, it is best to have a different, valid title on each page.

  If you use a template, let

• Problem with CSS formatting! Urgent help!

  I'm having a problem with the creation of a css formatting, in the past I've used tables and I'm trying to convert my sites for my clients. I put the site using div and css tags and it looks great, until I put in the cosing of the menu bar. When I put in the menu bar coding all of a sudden the bar has a padding around her, but I can't find a padding that it would change in the css coding. I need a result as soon as possible! so please help. ill show my code below:

  It's the div of coding:

  < div id = Nav >
  < ul class = menu "drop-down" id = "bar"; "Width: 879px" name = 'Bar' >
  < class li = "style16" style = "width: 161px;" height: 22px ">"
  < a href = "default.html" style ="width: 146px" > home < /a > < /li > "
  < class li = "style10" style = "width: 169px;" height: 23px ">"
  < a href = "about.html" style ="width: 153px" > on < /a > < /li > "

  < class li = "" style = "height: 31px; Width: 175px; left: 0px; Top: 0px ">"
  < a href = "Equipment.html" class = "style18" > "
  < div class = "style10" style = "width: 156px;" height: 20px; ">
  Hardware < / div >
  < /a > < ul class = "sub_menu" >
  < li > < a href = "compressor.html" > compressors Air < /a > < /li > ""
  < li > < a href = "compactions.html" > compaction < /a > < /li > ""
  < li > < a href = "concrete.html" > equipment concrete < /a > < /li > ""
  < li > < a href = "forklifts.html" > Fork Lifts < /a > < /li > ""
  < li > < a href = "generators.html" > generators < /a > < /li > ""
  < li > < a href = "groundthawing.html" > ground thaw < /a > < /li > ""
  < li > < a href = "heaters.html" > heaters < /a > < /li > ""
  < li > < a href = "scissorlifts.html" > Scissor Lifts < /a > < /li > ""
  < li > < a href = "boomlifts.html" > Boom Lifts < /a > < /li > ""
  < li > < a href = "lighttowes.html" > light towers < /a > < /li > ""
  < li > < a href = "misc.html" > various < /a > < /li > ""
  < li > < a href = "dirtequipment.html" > Dirt equipment < /a > < /li > ""
  < li > < a href = "powertools.html" > Power Tools < /a > < /li > ""
  < li > < a href = "pumps.html" > pumps | "" Saws | Welders < /a > < /li >
  < /ul >
  < /li >
  < style li = "width: 165px" > < a href = "locations.html" >
  < div class = "style10" style = "width: 154px" >
  Locations < / div >
  < /a >
  < /li >
  < style li = "width: 180px" > < a href = "contact.html" >
  < div class = "style16" style = "height: 24 PX" >
  Contact us < / div >
  < /a > < /li >
  < /ul >

  < / div >

  It's the css coding:

  
  {#wrapper}
  Width: 880px;
  margin-right: auto;
  left margin: auto;
  background-color: #f4f4f4;
  }

  {#Navigation}
  background-image: url(Images/NAvigation%20BAr.jpg);
  background-repeat: no-repeat;
  Width: 880px;
  visibility: visible;
  height: 3 - px;
  vertical-align: top;
  }
  {Of NAV
  vertical-align: top;
  margin: 0px;
  padding: 0px;
  Clear: both;
  height: 20px! important;
  }

  
  {#wrapper1}
  Width: 876px;
  margin-right: auto;
  left margin: auto;
  color: #F4F4F4;
  / * IE10 consumer Preview * /.
  background-image: ms-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * Mozilla Firefox * /.
  background-image:-moz-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * Opera * /.
  background-image:-o-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * Webkit (Safari/Chrome 10) * /.
  background-image:-webkit-gradient (linear, left top, upper-right, color-stop(0, #716375), color-stop(1, #E8E8E8));
  / * Webkit (Chrome, 11 +) * /.
  background-image:-webkit-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * W3C Markup, IE10 Release Preview * /.
  background-image: linear-gradient(to right, #716375 0%, #E8E8E8 100%).
  low-margin: auto;
  }
  {#Bar}
  background-repeat: no-repeat;
  Width: 880px;
  height: 28pt;
  overflow: visible;
  background-image: url(Images/NAvigation%20BAr.jpg);
  position: relative;
  vertical-align: top;
  }

  #container {}
  Width: 880px;
  Color: #000;
  background-color: #EDEDED;
  dominant baseline: 578px;
  / * IE10 consumer Preview * /.
  background-image: ms-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * Mozilla Firefox * /.
  background-image:-moz-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * Opera * /.
  background-image:-o-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * Webkit (Safari/Chrome 10) * /.
  background-image:-webkit-gradient (linear, left top, upper-right, color-stop(0, #716375), color-stop(1, #E8E8E8));
  / * Webkit (Chrome, 11 +) * /.
  background-image:-webkit-linear-gradient(left, #716375 0%, #E8E8E8 100%).
  / * W3C Markup, IE10 Release Preview * /.
  background-image: linear-gradient(to right, #716375 0%, #E8E8E8 100%).
  low-margin: auto;
  }

  #content {}
  float: left;
  color: #090;
  Width: 580px;
  padding-right: 6px;
  background-color: #033;
  top of the margin: 20px;
  }
  . Container {}
  Color: #000;
  background-color: #ff6;
  Width: 876px;
  }

  {#expect}
  height: 164px;
  Width: 294px;
  float: right;
  position: relative;
  background-color: #C90;
  margin left: 582px;
  padding-top: 10px;
  }
  {#hours}
  float: left;
  height: 55px;
  Width: 294px;
  line-height: 4px;
  Word-spacing: normal;
  white-space: normal;
  display: inline;
  letter-spacing: normal;
  padding-top: 10px;
  font size: 13pt;
  Color: #000;
  margin left: 586px;
  background-color: #F99;
  }
  #footer {}
  height: 76px;
  Width: 880px;
  background-color: #CC0;
  Clear: both;
  }

  
  {#cards}
  float: right;
  height: 31px;
  Width: 294px;
  margin left: 582px;
  padding-top: 10px;
  background-color: #F36;
  }

  {#contact}
  float: left;
  height: 328px;
  Width: 293px;
  Word-spacing: normal;
  white-space: normal;
  line-height: 1px;
  Color: #000;
  display: inline;
  do-size: 14pt;
  background-color: #FFF;
  padding-top: 10px;
  top of the margin: 20px;
  }
  #header {}
  background-image: url(Images/Proquip%20Logo/Proquip%20logo2.jpg);
  background-repeat: no-repeat;
  background-position: Center;
  Width: 885px;
  height: 126px;
  background-color: #000;
  right margin: 2.5px.
  left margin: 0px;
  }

  #wrapper #container #contact {strong p
  color: #800000;
  do-size: 14pt;
  }

  #wrapper #container #contact blockquote p {}
  Color: #000;
  }
  #wrapper #container #expect div {}
  color: #900;
  do-size: 14pt;
  make-weight: bold;
  }
  #wrapper #container #hours div {}
  color: #900;
  do-size: 14pt;
  make-weight: bold;
  }
  {#box2}
  background-image: url(Images/Option%201/Services/whitebox2.jpg);
  }
  {#box3}
  background-image:URL(images/option%201/services/redbox2.jpg);
  background-repeat: repeat no.;
  background-position: Center;
  }
  {#gold}
  background-image:URL(images/option%201/logos/gold.gif);
  background-repeat: repeat no.;
  }
  {#white}
  background-image:URL(images/option%201/Proquip-pics/Box1.gif);
  background-repeat: repeat no.;
  }
  {#forklift}
  background-image:URL(images/option%201/Proquip-pics/34-01-4380.jpg);
  background-repeat: repeat no.;
  }
  {#scissorlift}
  background-image:URL(images/option%201/Proquip-pics/JLG-scissor-lifts-21.jpg);
  background-repeat: repeat no.;
  }

  / * Navigation Menu - level a * /.
  UL {}
  list-style: none
  }
  {UL. DropDown}
  font size: 13pt;
  Color: #000000;
  height: 25px;
  text-decoration: none! important;
  Width: 860px;
  position: relative;
  vertical-align: top;
  }
  {UL #bar. DropDown}
  Width: 878px;
  position: relative;
  vertical-align: top;
  }

  UL. DropDown li {}
  Police-weight: 600;
  float: left;
  Zoom: 1;
  do-family: Arial, Helvetica, without serif.
  font size: 13pt;
  display: block;
  Width: 175px;
  Color: #000000;
  top: 25px;
  text-decoration: none! important;
  text-align: center;
  }
  UL. DropDown a: hover {}
  color: #cc0000;
  }
  UL. DropDown a: active {}
  Color: #000000;
  }
  UL. DropDown li a {}
  display: block;
  border-right: 1px solid #333;
  Color: #000000;
  border-right-width: 1px;
  text-decoration: none! important;
  text-align: center;
  }
  UL. DropDown li: last - child a {}
  border-right: none; / * does not wotk in IE * /.
  text-decoration: none! important; }
  UL. DropDown li.hover,
  UL. DropDown li.hover {}
  Color: #000000;
  position: relative;
  height: 28px;
  Top: 0px;
  }
  UL. DropDown li.hover a {}
  color: #800000;
  }

  / * Level two Navigation * /.
  UL. DropDown ul {}
  Width: 180px;
  visibility: hidden;
  position: absolute;
  top: 100%;
  left: 36%;
  display: block;
  float: left;
  Color: #000000;
  text-decoration: none! important;
  height: 25px;
  }
  UL. DropDown ul li {}
  make-weight: normal;
  Color: #000000;
  border-bottom: 1px solid #ccc;
  float: left;
  border-bottom-color: #c0c0c0;
  border-bottom-style: groove;
  display: block;
  background-color: #dbdbdb;
  text-decoration: none! important;
  }
  / * IE 6 & 7 needs to block inline * /.
  UL. DropDown ul li a {}
  border-right: none;
  display: inline-block;
  height: 18px;
  line-height: 16px;
  Color: #000000;
  Width: 100%;
  text-decoration: none! important;
  }
  / * Level three Navigation * /.
  UL. DropDown ul ul {}
  top: 100%;
  Color: #000000;
  text-decoration: none! important;
  }
  UL. DropDown li: hover > ul {}
  visibility: visible;
  Color: #000000;
  top: 30px;
  text-decoration: none! important;
  }

  Ah, I see now, you've introduced an error in your css. You currently have...

  UL. DropDown li {}

  Police-weight: 600;

  float: left;

  do-family: Arial, Helvetica, without serif.

  font size: 13pt;

  display: block;

  Width: 175px;

  Color: #000000;

  top: 25px;

  text-decoration: none! important;

  text-align: center;

  {margin: 0; padding: 0}

  }

  Delete these extra {}...

  UL. DropDown li {}

  Police-weight: 600;

  float: left;

  do-family: Arial, Helvetica, without serif.

  font size: 13pt;

  display: block;

  Width: 175px;

  Color: #000000;

  top: 25px;

  text-decoration: none! important;

  text-align: center;

  margin: 0;

  }

• I have a problem with CSS vertical align. Help!

  This could be an easy fix, I don't know... but I've been customized style BC Photo Gallery and lightbox on this site that I'm doing for a photographer and I got a problem with the vertical alignment.

  I created my own .css document to replace styles Viewer by default in British Colombia, and now all I'm left with tries to Center vertically the lightbox image. I googled some methods and tried, but had no luck...

  http://michaellaphotography.BusinessCatalyst.com/Gallery-pages/weddings

  Check out the link, and when you click on any thumbnail, you'll see what I mean.

  I know I can't use filling methods, because I work with pictures in portrait and landscape.

  Thanks for your help!

  The light therapy device you use made for the creation of a larger full size of the image.  As a general rule, if you have a portrait image that is larger that the screen of the user enough scroll a little more.

  If you temporarily remove the CSS for "img #lightbox" on line 20 of myStyles.css you'll see how lightbox works in native mode. This should be good since the user wants to zoom and see a bigger picture when they click on it and it will be as big as possible on their screen.

  Once you see what I mean with the changes, I can tell you how to make sure the portrait images do not expand to full height and beyond the viewport. Rather than delete the CSS "img #lightbox" statement like I said before, this time change for:

  #lightbox img {}

  Width: auto;

  height: 100%;

  }

  This will ensure the images in the light therapy device take 100% of the height of the lightbox container and the width dimensionnera automatically to keep the proportion of the image. Landscape photos will be large and landscape photos will not be larger than the viewport.

• Problems with tags custom .css and Internet Explorer

  Hello

  I'm new to these forums, but I've been coding market for about 12 years.  I am currently desiging a Web site for my place of work, and I'm having a lot of problems with Internet Explorer.  It is not our main browser, but I want to assure you that the site looks decent on almost all platforms, and I really have a problem with IE (to test the page using IE v8).

  There are a few problems, but I want to ask about this first (I use Dreamweaver CS5.5 btw):

  I made labels custom text (t1, t2, t3, t4) because I don't like the spacing you get from h1, h2, h3, etc.  In any case, I set these tags in my .css file and placed the tags in my html file.  Everything works fine in Firefox, Chrome and Safari, but IE COMPLETELY refuses to recognize all the tags and so the formatting.  I'm pasting below the relevant extracts from the code and the appearance of the code in firefox vs IE.

  First the html 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=utf-8" />
  <meta name="viewport" content="width=device-width" />
  <title>Precise Diagnostics, Inc.</title>
  <script src="SpryMenuBar.js" type="text/javascript"></script>
  <script src="BrowserDetect.js" type="text/javascript"></script>
  <script src="DrawMain.js" type="text/javascript"></script>
  <link href="SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
  
  <!-- iPhone
  <link href="iphone.css" rel="stylesheet" type="text/css" media="only screen and (max-width:320px)" />
  -->
  
  </head>
  
  <body>
  
  <t1>Laboratory Overview</t1>
      <t2>Precise Diagnostics Laboratory is an independent CLIA certified full-service anatomical pathology laboratory dedicated to provide a diagnostic excellence. Our facility utilizes state-of-the-art   instrumentation and medical technology. Our experienced, board-certified   pathologists strive to meet the highest standards of pathology service.</t2>
      <br />
      <t2>At Precise Diagnostics, Inc. a highly trained team of   laboratory professionals provide fast, accurate, laboratory services in   quest for excellence. </t2>
  <br />
  <t1>Certification &amp; Accreditation</t1>
      <t2>Precise Diagnostics, Inc. is a fully accredited, CLIA certified laboratory with license in New York.</t2>
      <br />
  <t1>Hours of Operation</t1>
      <t2>Laboratory</t2>
          <t3>Monday through Saturday: 10 AM to 8 PM; Sunday: 10 AM to 5 PM</t3>
      <br />
      <t2>Patient Billing Queries (347-861-7571)</t2>
          <t3>Monday through Friday: 9 AM to 4 PM</t3>
  
  </body>
  </html>
  

  And now my .css code snippet:

  t1
  {
      /*font-family: Calibri;*/
      font-weight: bold;
      font-size: 1.2em;    
      display: block;
  }
  
  t2
  {
      /*font-family: Calibri;*/
      font-weight: bold;
      font-size: 0.9em;        
      display: block;
      padding-left: 20px;
  }
  
  t3
  {
      /*font-family: Calibri;*/
      font-weight: normal;
      font-size: 0.8em;        
      display: block;
      padding-left: 40px;
  }
  
  t4
  {
      /*font-family: Calibri;*/
      font-weight: normal;
      font-size: 0.9em;
      display: inline;
      padding-left: 20px;
  }
  
  Body
  {
      font-family: Calibri;
      color: black;
      background-image: url(background-plain-original.jpg);
      background-repeat: repeat-x;
  }
  

  Appearance in firefox:

  

  Appearance in Internet Explorer:

  

  Now, I guess I'm missing something very minor, but I have no idea as to what.  Please PLEASE help me.  Otherwise, I use a workaround solution that takes 4 times the code and inconvenience.  Thanks in advance!

  And, in case of conflict between the rules, an id selector rule slip away a class selector rule.  For example -.

  #s1 {color: red ;}}

  . H2 {color: green ;}}

  ...

  This will be red

• Problem with CSS

  Hi all

  I have a problem with an ogo on the next page.

  http://empdigital.NET/dmi_css_may2011/index_test_v3_contact.html

  The other pages are fine, but I'm sure the CSS and a conflicted musy table cell will have something to do with it. My self-taught knowledge of CSS is more, but I can't find has this problem is.

  I appreiate any help.

  Concerning

  If you want the color of the logo on the left, change this in your table tag:

  to do this:

  FYI: Provisions of base tables are very old school.  The modern approach is to use CSS for layout and tables for tabular data, such as graphics or spreadsheets.

  Tables to CSS Web Design part 1-
  http://www.Adobe.com/devnet/Dreamweaver/articles/table_to_css_pt1.html

  Tables to CSS Web Design part 2-
  http://www.Adobe.com/devnet/Dreamweaver/articles/table_to_css_pt2.html

  Nancy O.
  ALT-Web Design & Publishing
  Web | Graphics | Print | Media specialists
  http://ALT-Web.com/
  http://Twitter.com/ALTWEB

• Problem with css background

  Hey guys, I have a problem with a code. I have some divs nested inside a container for body copy dive, but I have a problem with the background of the div container behind the nested divs. I have this problem with the background, when am I going to float the nested divs.

  Here's a copy of my html code as well as a copy of my related css stylesheet.

  <!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>Welcome to Optimus Lens</title>
  <link href="style.css" rel="stylesheet" type="text/css" />
  <script type="text/javascript">
  function MM_swapImgRestore() { //v3.0
    var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
  }
  function MM_preloadImages() { //v3.0
    var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
      var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
      if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
  }
  
  function MM_findObj(n, d) { //v4.01
    var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
      d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
    if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
    for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
    if(!x && d.getElementById) x=d.getElementById(n); return x;
  }
  
  function MM_swapImage() { //v3.0
    var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
     if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
  }
  </script>
  <style type="text/css">
  #sector {
       background-repeat: no-repeat;
       background-position: left;
       width: 869px;
       margin-top: -51px;
       margin-right: auto;
       margin-bottom: 0;
       margin-left: auto;
  }
  #oag {
       width: 574px;
       margin-left: 23px;
       float: left;
       /* [disabled]position: relative; */
  }
  #small_col {
       width: 279px;
       margin-right: 23px;
       float: right;
       /* [disabled]position: static; */
  }
  </style>
  </head>
  
  <body onload="MM_preloadImages('images/home_over.jpg','images/our_mission_over.jpg','images/products_over.jpg','images/news_over.jpg','images/order_over.jpg','images/contact_over.jpg')">
  <div id="CONTAINER">
         <div id="header"><img src="images/header_top.png" width="916" height="39" />
         <img src="images/header_logo.jpg" width="916" height="95" />
        <img src="images/header_image.jpg" width="916" height="266" />
         <img src="images/header_bar.jpg" width="916" height="9" />
  </div>
    
        <div id="menuContainer">
      
       <!-- NAVIGATION -->
           
                  <ul> 
                  <li>
                  <img src="images/fold_left_top.png" width="22" height="35" /><img src="images/menu_left.jpg" width="197" height="35" />
                  </li>
                  <li>
                      <div class="menu n1"><a href="index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home','','images/home_over.jpg',1)"><img src="images/home_up.jpg" alt="home" name="home" width="66" height="35" border="0" id="home" /></a></div></li> 
                  <li>
                    <div class="menu n2"><a href="mission.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Our Mission','','images/our_mission_over.jpg',1)"><img src="images/our_mission_up.jpg" alt="Our Mission" name="Our Mission" width="124" height="35" border="0" id="Our Mission" /></a></div></li> 
                  <li>
                      <div class="menu n3"><a href="products.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Products','','images/products_over.jpg',1)"><img src="images/products_up.jpg" alt="products" name="Products" width="98" height="35" border="0" id="Products" /></a></div></li> 
                  <li>
                      <div class="menu n4"><a href="news.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('News','','images/news_over.jpg',1)"><img src="images/news_up.jpg" alt="News" name="News" width="77" height="35" border="0" id="News" /></a></div></li> 
                  <li>
                      <div class="menu n5"><a href="order.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Order','','images/order_over.jpg',1)"><img src="images/order_up.jpg" alt="Order" name="Order" width="77" height="35" border="0" id="Order" /></a></div></li>
                  <li>
                    <div class="menu n6"><a href="contact.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact','','images/contact_over.jpg',1)"><img src="images/contact_up.jpg" alt="Contact" name="Contact" width="80" height="35" border="0" id="Contact" /></a></div></li>
                  <li>
                    <img src="images/menu_right.jpg" width="197" height="35" /><img src="images/fold_right_top.png" width="22" height="35" /> </li>
                  </ul>
      
        </div>
         <div id="header_bottom"><img src="images/fold_left_bottom.png" width="22" height="38" /><img src="images/header_bottom.jpg" width="916" height="38" /><img src="images/fold_right_bottom.png" width="22" height="38" />
      </div>
  
       <div id="bodycopy">
         <div id="sector">
        <img src="images/home/sector_top.png" width="869" height="341" alt="sector frames" />
        </div>
        
         <p> </p>
        
         <div id="oag">
        <img src="images/home/oag_join.png" width="574" height="281" alt="save with oag" />
        <p> </p>
        <img src="images/home/bottom.png" width="574" height="132" />
        </div>
        
        <div id="small_col">
        <img src="images/home/optimize_small.png" width="279" height="132" />
        <p> </p>
        <img src="images/home/intuition_small.png" width="279" height="132" />
        <p> </p>
        <img src="images/home/intuition_small.png" width="279" height="132" />
        </div>
       </div>
  
      <div id="footer"><img src="images/footer.png" width="916" height="52" />
    </div>
  </div>
  </body>
  </html>
  body {
       margin: 0px;
       background-image: url(images/background_fade_04.jpg);
       background-repeat: repeat-x;
       background-position: top;
       background-color: #DCDCDC;
       font-family: Arial, Helvetica, sans-serif;
       font-size: 13px;
  }
  #box1 {
       background-image: url(images/bodycopybox_01.png);
       background-repeat: no-repeat;
       background-position: left;
       height: 54px;
       width: 869px;
       margin-top: 0;
       margin-right: auto;
       margin-bottom: 0;
       margin-left: auto;
  }
  
  #box2 {
       background-image: url(images/bodycopybox_02.png);
       background-repeat: repeat-y;
       background-position: left;
       width: 869px;
       margin-top: 0;
       margin-right: auto;
       margin-bottom: 0;
       margin-left: auto;
  }
  .bodycopybox {
       padding-right: 40px;
       padding-left: 40px;
  }
  .bodycopyboxheader {
       padding-right: 40px;
       padding-left: 40px;
       font-weight: bolder;
       font-family: Arial, Helvetica, sans-serif;
       font-size: 14px;
       color: #21368b;
  }
  
  
  
  #box3 {
       background-image: url(images/bodycopybox_04.png);
       background-repeat: no-repeat;
       background-position: left;
       height: 31px;
       width: 869px;
       margin:0 auto;
  }
  
  #box4 {
       background-image: url(images/bodycopybox_03.png);
       background-repeat: no-repeat;
       background-position: left;
       height: 31px;
       width: 869px;
       margin:0 auto;
  }
  
  p {
       margin: 0px;
  }
  
  #header_bottom {
       width: 960px;
       margin:0 auto;
  }
  
  #CONTAINER {
       width: 100%;
       margin:0 auto;
  }
  #header {
       width: 916px;
       margin:0 auto;
  }
  #menuContainer {
       width: 960px;
       margin:0 auto;
       height: 35px;
  }
  #menuContainer ul{
       list-style:none;
       height:35px;
       margin:0;
       padding:0;
  }
  #menuContainer li{
       float:left;
       height:35px;
       margin:0;
       padding:0;
  }
  #menuContainer li a{
       text-align:center;
       float:none;
       height:35px;
       margin:0;
       padding:0;
  }
  div.menu{position:relative;}
  .n1{
       width:66px;
       float:left;
       display:inline-block;
       clear:both;
  }
  .n2{
       width:124px;
       float:left;
       display:inline-block;
       clear:both;
  }
  .n3{
       width:98px;
       float:left;
       display:inline-block;
       clear:both;
  }
  .n4{
       width:77px;
       float:left;
       display:inline-block;
       clear:both;
  }
  .n5{
       width:77px;
       float:left;
       display:inline-block;
       clear:both;
  }
  .n6 {
       width:80px;
       float:left;
       display:inline-block;
       clear:both;
  }
  #bodycopy {
       background-color: #FFFFFF;
       width: 916px;
       padding: 0px;
       margin-top: 0;
       margin-right: auto;
       margin-bottom: 0;
       margin-left: auto;
  }
  #footer {
       width: 916px;
       margin:0 auto;
       padding: 0px;
  }
  			 
  Hey guys, I have a problem with a code. I have some divs nested inside a dive of container for the body copy, but I have a problem with the background of the div container behind the nested divs. I have this problem with the background, when am I going to float the nested divs.
  I come to this quote.  The background of this div container is set to white (#FFF).  The other 3 that are nested inside have no defined background.  There are images placed inside them, but nothing of what happened to the bottom, so if it is empty it should inherit the parent container which is white.
  Can you show us a screenshot or view the page online for testing?
  		   

• Problem with the 2.0 (1.0) Spry menu bar re - CSS

  Hello:

  I'm having some trouble with a Spry (horizontal) 2.0 (1.0) menu bar I created.  Initially, I thought the problem was in what concerns the problems of rendering on IE 6.0, but the problem seems to be more general than that, and I came to believe that this has to do with the CSS created by the browser Widget and changed once imported in the Web page.  That's why I chose to post my question here rather than on the spry page.

  I leaned on the tutorial provided by David Powers (Bayside.css) and in addition any other documentation regarding the Spry UI bar menu.  The problem appeared as one of the 6 IE rendered page with a gap that is created when the menus appear, so push down the divs that appear below the page.

  However, through a laborious process of trial and error, my problem now seems to be that when I export the CSS generated by the browser widget to an external style sheet (the style sheet General governing the whole of the site), he comes into conflict with other CSS styles for links etc.  The end result is that all the padding, background colors, background images, and colors of text are lost.  As long as the CSS is in the head that this does not happen.

  My thought is that this must have to do with the problems of specificity, inheritance, etc.

  The site is available at the following ADDRESS: http://www.aclco.org/testing/index.html.  In its current form, all the CSS associated with the menu bar is located at the head of each page.  (see CSS below).

  My question is I can set up a separate style sheet for the menu bar horizontally and have these styles applied specifically (and only) in the menu bar my only alternative is to work through the rest of the General style sheet and the work by problems of specificity/inheritance - that may be the "best" practice , but it may create another 'cascading' [sic] problems elsewhere.

  Advice or suggestions or directed readings (which would point to a solution) that could be offered would be greatly appreciated.

  Steve Webster

  The horizontal CSS governing the menu bar is as follows: (currently the following CSS is embedded in the web page's head)
  

  < style type = "text/css" >

  / * - Start styles horizontal Spry Menu Widget 2.0 (1.0) menu bar-* /.

  
  / * BeginOAWidget_Instance_2141544: #MenuBar * /.
  / * Values for skinning a basic through presets menu. If the default settings are not sufficient, most count should be done in
  These rules, except for the images used to down or to the right pointing arrows, located in the SpryMenuBasic.css file
  
  They take the following classes of widget for layout of menu (located in a "Preset")
  . MenuBar - applies to all menu bars - default is a horizontal bar, all submenus are vertical - level 2 subs and beyond are drop down to the right.
  . MenuBarVertical - vertical main bar; All submenus are drop down to the right.
  
  You can also pass in extra classnames to set your desired top-level menu bar layout. Normally, they are defined by using a predefined setting.
  They apply only to the horizontal menu bars:
  MenuBarLeftShrink - the menu bar will be horizontally "shrinkwrapped" be just big enough to hold his items and left-aligned
  MenuBarRightShrink - as MenuBarLeftShrink, but right-aligned
  MenuBarFixedLeft - set to a specified width defined in rule "." MenuBarFixedLeft', and left-aligned.
  MenuBarFixedCentered - Fixed to a specified width defined in rule "." MenuBarFixedCentered',.
  and centered in its parent container.
  MenuBarFullwidth - expands to fill the width of the parent container.
  
  In general, all the rules specified in this file are prefixed by #MenuBar so that they don't apply to instances of the widget inserted along
  with the rules. This allows use of multiple MenuBarBasic widgets on the same page with different layouts. Due to limitations in IE6.
  There are a few rules where this was not possible. These rules are so noted in the comments.
  
  */

  {#MenuBar}
  background-color: transparent;
  do-family: Arial, Helvetica, without serif. / * Specify the fonts on the bar menu and submenu MenuItemContainer, so MenuItemContainer.
  MenuItem and MenuItemLabel
  at a given level all use the same definition for ems.
  Note that this means that the size is also inherited from the submenus of the child,
  so be careful when using other than relative sizes
  100% on the fonts submenu. */
  make-weight: normal;
  font size: 17px;
  make-style: normal;
  padding: 0;
  
  }
  / * ATTENTION: because ID + class selectors do not work correctly in IE6, but we want to restrict these rules to all this
  instance of widget, we used the concatenated string classnames to our selectors for the type of layout of the menu bar
  in this section. These have very low specificity, so be careful not to overstep accidentally. */

  . MenuBar br {/ * using only a class, so there same specificity that the "."} MenuBarFixedCentered br' rule bleow * /.
  display: none;
  }
  . {MenuBarLeftShrink}
  float: left; / * shrink the content, but also to float the menu bar * /.
  Width: auto;
  }
  . {MenuBarRightShrink}
  float: right; / * shrink the content, but also to float the menu bar * /.
  Width: auto;
  }
  . {MenuBarFixedLeft}
  float: left;
  Width: 80em;
  }
  . {MenuBarFixedCentered}
  float: none;
  Width: 80em;
  margin-left: auto;
  margin-right: auto;
  }
  . MenuBarFixedCentered br {}
  Clear: both;
  Display: block;
  }
  . MenuBarFixedCentered. Submenu br {}
  display: none;
  }
  . {MenuBarFullwidth}
  float: left;
  Width: 100%;
  }

  / * Top level bar small objects - these actually apply to all items and get substituted for the submenus level 1st or successive * /.
  #MenuBar. {MenuItemContainer}
  padding: 0px 0px 0px 0px;
  margin: 0;     / * Zero margin on the containers of items. The MenuItem is the active area of hover.
  For most elements, we have padding top or bottom or border only on MenuItem
  or a child so we keep all tiled submenu with elements.
  Definition of this 0 avoids the "dead zones" to hover. */
  }
  #MenuBar. {}, MenuItem
  padding: 10px 10px 10px 4px;
  background-color: #000088;
  background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/navigation%20Bar%20Segm ent - Dark.png);
  background-repeat: repeat-x;
  
  }
  #MenuBar. {MenuItemFirst}
  border-style: none none no none;
  }
  #MenuBar. {MenuItemLast}
  border-style: none none no none;
  }

  #MenuBar. MenuItem. {MenuItemLabel}
  text-align: center;
  line-height: 1.4em;
  color: #ffffff;
  background-color: transparent;
  padding: 0px 18px 0px 5px;
  Width: 10em;
  Width: auto;
  }
  . SpryIsIE6 #MenuBar. MenuItem. {MenuItemLabel}
  Width: 1em; / * Equivalent to min-width in modern browsers * /.
  }

  / * First level of submenu items * /.
  #MenuBar. Submenu. {}, MenuItem
  do-family: Arial, Helvetica, without serif.
  make-weight: bold;
  font size: 15px;
  make-style: normal;
  background-color: #000088;
  padding: 0px 2px 0px 0px;
  border-width: 0px;
  border color: #cccccc #cccccc #cccccc #cccccc.
  / * Border styles are replaced by first and last items * /.
  border-style: solid solid no solid;
  }
  #MenuBar. Submenu. {MenuItemFirst}
  border-style: none;
  padding: 0px;
  }
  #MenuBar. Submenu. MenuItemFirst. {MenuItemLabel}
  padding-top: 0px;
  }
  #MenuBar. Submenu. {MenuItemLast}
  border-style: none none no none;
  }
  #MenuBar. Submenu. MenuItemLast. {MenuItemLabel}
  padding-bottom: 10px;
  }
  #MenuBar. Submenu. MenuItem. {MenuItemLabel}
  text-align: left;
  line-height: 1em;
  background-color: transparent;
  color: #ffffff;
  padding: 10px 10px 10px 10px;
  Width: 240px;
  
  }

  / * Hover States for containers, objects and labels * /.
  #MenuBar. {MenuItemHover}
  background-color: #2E35A3;
  background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/navigation%20Bar%20Segm ent%20Light2.png);
  background-repeat: repeat-x;
  
  }

  #MenuBar. MenuItemWithSubMenu.MenuItemHover. {MenuItemLabel}
  background-color: transparent; / * expose this propeller separately * /.
  color: #ffffff;
  }
  #MenuBar. MenuItemHover. {MenuItemLabel}
  background-color: transparent;
  color: #ffffff;
  }
  #MenuBar. Submenu. {MenuItemHover}
  background-color: #2E35A3;
  
  }

  #MenuBar. Submenu. MenuItemHover. {MenuItemLabel}
  background-color: transparent;
  color: #ffffff;
  }
  / * The submenu - first-level submenus properties * /.
  #MenuBar. {SubMenuVisible}
  background-color: transparent;
  min-width: 0%;  / * This prevents the menu being lean that the parent MenuItemContainer - but not available on ie6 nice to have * /.
  border-style: none none no none;
  }
  #MenuBar.MenuBar. SubMenuVisible {/ * menu bar horizontally for only * /}
  top: 100%;    / * 100% is at the bottom of menuItemContainer parent * /.
  left: 0px; / * "left" may need tuning according to borders or padding applied to the bar MenuItemContainer or MenuItem,.
  and your personal taste.
  0px align left drop-down list with the content of the MenuItemContainer area. Assuming you keep the margins 0
  on MenuItemContainer and on the parent MenuItem
  menu bar, which in fact equals the sum of padding-left MenuItemContainer & MenuItem align
  the drop-down menu to the left of the menu item label.*.
  z-index: 10;
  }
  #MenuBar.MenuBarVertical. {SubMenuVisible}
  Top: 0px;
  left: 100%;
  min-width: 0px; / * Do not neeed to match the width of the parent MenuItemContainer - elements will avoid total collapse * /.
  }
  / * The sous-menu--deuxieme submenu level properties and beyond - are visible to descendants. MenuLevel1 * /.
  #MenuBar. MenuLevel1. {SubMenuVisible}
  background-color: transparent;
  min-width: 0px; / * Do not neeed to match the width of the parent MenuItemContainer - elements will avoid total collapse * /.
  Top: 0px;    / * If you want, you can move this down a smidge to separate the top item "submenu s of menubar.
  It is really necessary only for the submenu on the first point of MenuLevel1, or you can make it negative to make the submenu
  vertically 'centered' about his call to * /.
  left: 100%; / * If you want to move the submenu on the left to partially cover the point of his call, you can add a margin to the left with a
  negative value to this rule. Alternatively, if you use the elements of fixed width, you can change this value on the left
  to use px or ems to get the desired offset. */
  }
  / * IE6 rules - you can remove these if you do not want to support IE6 * /.

  / * Note about several classes in IE6.
  Some rules above use several class names to an element of selection, such as "hover" (MenuItemHover) and 'a a submenu' (MenuItemWithSubMenu).
  * give the selector '. MenuItemWithSubMenu.MenuItemHover'.
  * Unfortunately, IE6 does not support using mutiple classnames in a selector for an element. For a selector like '. foo.bar.baz', IE6 does not take into account
  * all but the final classname (here, ".baz") and defines the specificity in consequence, with only one of these classs as significant. To work around this problem
  * problem, we use the plugin in SpryMenuBarIEWorkaroundsPlugin.js to generate classnames for IE6, such as "MenuItemWithSubMenuHover".
  * Given that many of these necessary, the plugin does not generate additional classes for modern browsers, and we use the copies of CSS2 style class
  * syntax for that. Since IE6, both apply the rules where the
  * It should not and gets the specificity wrong too, we have rules of order carefully, then misapplied rule in IE6 can be overridden.
  * So we put first the multiple class rule. IE6 wrongly apply this rule.  We follow this with the single class rule that it would be
  * replace by mistake, by ensuring that the specificity of IE6 interpreted as is the same as the unique class selector, so the latter wins.
  * We then create a copy of the rule of multiple class, adding a "." SpryIsIE6' in the context of the class and to ensure that the specificity
  * the selector is high enough to beat the rule of single class in the case of "match of these two classes. We place the rule of IE6 at the end of the
  * block of css styling to make it easy to remove if you want to drop support for IE6.
  * If you decide you do not need IE6 support, you can get rid of these, as well as the inclusion of the SpryMenuBarIEWorkaroundsPlugin.js script.
  * The 'SpryIsIE6' class is placed on the HTML element by the script in SpryMenuBarIEWorkaroundsPlugin.js if the browser is Internet Explorer 6. This avoids the need of IE conditional comments to these rules.
  */
  . SpryIsIE6 #MenuBar. MenuBarView. MenuItemWithSubMenuHover. MenuItemLabel / * selector IE6 * /}
  background-color: transparent; / * expose this propeller separately * /.
  color: #ffffff;
  }
  . SpryIsIE6 #MenuBar. MenuBarView. Submenu. MenuItemWithSubMenuHover. MenuItemLabel / * selector IE6 * /}
  background-color: transparent; / * expose this propeller separately * /.
  color: #ffffff;
  }
  . SpryIsIE6 #MenuBar. Submenu. Submenu / * selector IE6 * /}
  left margin:-0px; / * Offset at least part of a version of 'double upholstery' bug IE6 'double margin "* /.
  }

  
  / * EndOAWidget_Instance_2141544 * /.

  / * End Spry Menu Bar Widget 2.0 (1.0) Horizontal Menu Custom styles * /.

  
  < / style >

  The CSS for the site in general is reproduced below: (my belief is that it is a: link, a: visited, a: hover, a: active styles that may be in conflict).

  @charset "utf-8";

  
  {body
  Police: 100% Verdana, Arial, Helvetica, without serif.
  min-height: 0; / * this is necessary to overcome the "haslayout" bug found in Windows 7 in conjunction with IE8.  For more information see: URL - http://reference.sitepoint.com/css/haslayout.html * /
  margin: 0; / * It is advisable to zero, the margin and the filling of the body to hold element has a different default browser * /.
  padding: 0;
  text-align: center; / * This allows the centering of the container and overcomes an inherent bug in IE 5 * /.
  Color: #000000;
  list-style-image: none;
  background-color: #FCFCFC;
  
  }

  H1, h2, h3, h4, h5, h6 {}

  color: #000066;

  }

  a: link {}
  color: #151A 96.
  text-decoration: underline;
  }
  a: visited {}
  text-decoration: underline;
  color: #1B8DCD;
  }
  a: hover {}
  text-decoration: none;
  color: #F30A0A;
  }
  a: active {}
  text-decoration: underline;
  color: #151A 96.
  }

  #container {}
  Width: 960px;
  margin: 0 auto; / * margins (in conjunction with a width) auto Center the page * /.
  text-align: left; / * This setting overrides the text-align: center on the body element. */
  background-image:
  URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Midsection%20_960.png);
  background-repeat: repeat-y;
  }

  #header {}
  padding: 0;  / * This filling is the alignment to the left of the items in the div that appear below. If an image is used in the #header instead of text, you can remove the padding. */
  
  Width: 960px;
  height: 332px;
  background-image:
  URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Header_960.png);
  background-repeat: repeat no.;
  }

  
  #header h1 {}
  
  margin-right: 0px; / * zero setting of the margin of the last element in the #header div tag will prevent the collapse of margin - inexplicable space between divs. If the div has a border around it, this isn't necessary, which also allows to avoid the collapse of margin * /.
  padding: 0; / * padding instead of margin will allow you to keep the edges of the div element * /.
  display: none;

  }

  #header img {}
  display: none;
  }

  {#Main_nav_contents}
  padding: 0;
  margin-top: 0px;
  height: 39px;
  Width: 950px;
  padding-top: 275px;
  padding-left: 39px;
  z index: 3;
  
  }

  {#MenuBarVertical}
  margin-bottom: 50px;
  padding-top: 50px;
  padding-bottom: 200px;
  padding-left: 15px;
  padding-right: 15px;
  
  }

  
  {.mainContent_left}
  margin: 0; / on this div element right margin creates the column on the right side of the page - no matter how content div the sidebar1″ contains, the space of the columns will remain. You can remove this line if you want the #mainContent div text to fill the space of #sidebar1 when the content of #sidebar1 is complete. */
  padding-left: 30px;
  padding-right: 20px; / * Remember that the fill is space inside the box of div and margin is the space outside the div box * /.
  Width: 600px;
  float: left;
  }

  
  {.sidebar_right}
  float: right; / * because this element is floating, it takes a width * /.
  Width: 270px; / actual width of this div, in browsers comply with the standards, or the standard mode of Internet Explorer includes the padding and border in addition to width * /.
  top of the margin: 30px;
  margin-left: 0;
  margin-right: 10px;
  font-size: 90%;
  
  }
  
  {.mainContent_right}
  margin-left: 10px;
  padding-left: 30px;
  padding-right: 20px;
  Width: 600px;
  float: right;
  
  }
  
  {.sidebar_left}
  float: left; / * because this element is floating, it takes a width * /.
  Width: 270px; / actual width of this div, in browsers comply with the standards, or the standard mode of Internet Explorer includes the padding and border in addition to width * /.
  top of the margin: 30px;
  margin-left: 30px;
  margin-right: 0;
  overflow: hidden;
  font-size: 90%;
  
  }
  
  {.main_content_centered}
  Width: 650px;
  margin left: 155px;
  
  }

  {.main_content_centered_header}
  margin left: 75px;

  
  }

  {.sidebar_textbox}
  margin: 0px;
  Width: 260px;
  padding: 2px;
  }

  
  {.sidebar_textbox_header}

  Width: 255px;
  height: 58px;
  background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/portrait%20Textbox%20he ader.png);

  }

  {.sidebar_textbox_background_middle}

  Width: 255px;
  padding-top: 12px;
  padding-bottom: 10px;
  background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/portrait%20Textbox%20Mi ddle.png);
  background-repeat: repeat-y;
  }

  {.sidebar_textbox_content}
  / * The width and filling are fixed as follows to reflect the quirks in the rendering of the browser while ensuring that the text is contained in the background of the text box * /.
  
  Width: 230px;
  padding-left: 20px;
  padding-right: 40px;
  }

  {.sidebar_textbox_footer}

  Width: 255px;
  height: 64px;
  background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/portrait%20Textbox%20Foo ter.png);

  }

  #issues_menu a: link {}
  color: #151A 96.
  text-decoration: none;
  make-weight: bold;
  
  }

  
  #issues_menu a: visited {}
  color: #151A 96.
  make-weight: bold;
  text-decoration: none;

  }

  #issues_menu a: hover {}
  color: #F30A0A;
  make-weight: bold;
  make-style: oblique;
  text-decoration: none;
  
  }

  #issues_menu a: active {}
  color: #151A 96.
  make-weight: bold;
  text-decoration: none;
  
  }

  {#archives}
  padding-top: 15px;
  padding-right: 15px;
  padding-bottom: 20px;
  padding-left: 0px;

  }

  {.landscape_textbox}
  Width: 500px;
  margin-right: 0px;
  margin left: 30px;
  padding-top: 35px;.
  padding-bottom: 25px;
  make-style: normal;
  make-weight: normal;

  }

  {.landscape_textbox_hdr}

  Width: 500px;
  height: 38px;
  margin: auto;
  padding: 0;
  background-image:
  URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Landscape%20Textbox%20Header.png);
  
  }

  {.landscape_textbox_middle}

  Width: auto;
  margin: auto;
  padding-top: 12px;
  padding-bottom: 12px;
  background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/landscapte%20Textbox%20 Middle.png);
  background-repeat: repeat-y;
  
  }

  {.landscape_textbox_content}

  Width: 450px;
  Padding: 25px;
  }

  {.landscape_textbox_ftr}

  Width: 500px;
  height: 44px;
  margin: auto;
  padding: 0;
  background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/Landscape%20Textbox%20F ooter.png);

  }

  
  #footer {}
  padding: 0; / * This filling is the alignment to the left of the items in the div that appear above him. */
  Width: 960px;
  height: 222px;
  background-image:
  URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Footer%20_960.png);
  background-repeat: repeat no.;
  
  }

  #footer p {}
  margin: 0px; / * zero setting the margins of the first element in the footer will avoid the possibility of the collapse of the margin - a space between the div tags * /.
  padding: 0px; / * padding on that element will create space, just as it would the margin, free margin collapse question * /.
  text-align: center;
  margin-left: 50px;
  right margin: 50px;
  padding: 10px;
  font size: small;
  }
  
  #footer h5 {}

  text-align: center;

  }

  .fltrt {/ * this class can be used to float right to the item in your page.} The floating element must precede the element it should be next to the page. */
  float: right;
  left margin: 8px;
  }
  .fltlft {/ * this class can be used to float an element on your page to the left * /}
  float: left;
  right margin: 8px;
  }
  .clearfloat {/ * this class must be placed on an element div or break and should be the last item before closing a container should completely contain a float * /}
  Clear: both;
  height: 0;
  font size: 1px;
  line-height: 0px;
  }

  
  {.dropcap}
  display: block;
  float: left;
  line-height: 80%;
  font size: 250%;
  make-weight: bolder;
  color: #000066;
  Padding: .1em .03em 0 0;
  }

  {.red_arrows}
  list-style-position: outside;
  list-style-image: url (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Arrow%20Large.png);
  }

  {.blue_bullets}
  list-style-position: outside;
  list-style-image: url (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Bullet%20Medium%20Full.png);
  }

  attention {}
  color: #F30A0A;
  font-size: x-large;
  do-family: Georgia, "Times New Roman", Times, serif;
  make-style: italic;
  Police-weight: 900;
  }
  
  {.attention_small}
  color: #F30A0A;
  font size: large;
  do-family: Georgia, "Times New Roman", Times, serif;
  make-style: italic;
  Police-weight: 900;
  }

  .table {}
  table-layout: fixed;
  
  }
  . Blue {}
  Color: #00F;
  }
  #container .mainContent_left p .blue {}
  color: #0303A 0;
  }

  Hello Steve

  Well, I checked your page in IE6 and it seems to work fine for me except that here seemes to be a little space between

• items that may be due to lack of support of .png?  In other words, if there is a little transparency on the edge of the chart?  Maybe it's more a shot in the water on my part!

  Now my suggestion to you would be to mark this thread as closed/replied and after again with just the link to the page and your question.  Short is sweet.

  Martin