Jump to content


  • Content Count

  • Joined

  • Last visited

Everything posted by mboehler3

  1. A lot of this makes sense to me, so now I am coding this to look right in Firefox, Chrome, et al. Running into a problem getting my two text boxes to align within the background image. For some reason it cuts off in Firefox:And in Chrome the boxes are pushed up just a little:Here is my updated CSS:.inputboxusr {border:0;background-image: url('/images/960/accountant-center/ac-user.gif');background-color:transparent; background-repeat: no-repeat; height: 34px; width: 98px; background-position: 0 -20px;}.inputboxpwd {border:0;background-image: url('/images/960/accountant-center/ac-pass.gif');ba
  2. I am having a problem with viewing my website on a Mac computer. In all browsers on my PC, the footer looks fine, like this:But on a Mac, in both Safari and Firefox, a horizontal scrollbar is added to the footer, seen here:Here is my code: <div class="footerBody"> <div id="content-outer"> <div class="container_12"> <div class="grid_4 leftTextAlign"> <!-- #include virtual = "/Include/960/globals/footer_leftcolumn.asp" --> </div> <div class="grid_4 leftTextAlign margin0"> <div class="footerTitle">Quick Links</div> <div cl
  3. Well it looks the same in 8 and 6. My problems are with Firefox/Safari/Chrome browsers
  4. I'm not able to validate the code because I'm testing on my server-side. I did however, separate the style that was in the code, which now looks like this: <div class="sclogin"> <form class="surechoiceLogin" name="frmMain" method="post" action="/accountant_access.asp"><input name="action" value="Edit" type="hidden"><input name="partnerCode" value="" type="hidden"> <img src="/images/clear.gif" height="5px" width="0" /> <img src="/images/ac-login.gif" height="34" type="image" width="178" style="margin-left:-5px;"> <img src="/images/clear.gif"
  5. Yeah that's what I did to get it to look right in IE. When I remove the negative, or change it to positive 7, everything becomes mis-aligned in IE.
  6. I am trying to style the login to my website. There is a discrepancy between Firefox and IE. IE looks great:But in FF, the two background images I've created for the login and pass do not align properly:Here is my HTML: <div style="float:right; text-align:right; background-image: url('/images/960/accenter/ac-loginbckgd.gif'); background-repeat:repeat-x; background-position: 0 11px;"> <form class="Login" name="frmMain" method="post" action="/accountant_access.asp"><input name="action" value="Edit" type="hidden"><input name="partnerCode" value="" type="hidden"> <
  7. thanks, you're right, I added the IE6 code and the tabs show. Thanks for the help!
  8. Thank you for the link... but I don't have overflow:visible declared anywhere in the CSS. Do I need to add it somewhere, and then add the position:relative and overflow:hidden somewhere else?
  9. Still trying to figure out why there is the bottom spacing issue on that rollover... anybody is welcome to offer their suggestion(s).........
  10. I have a tab-content system set up, and in IE6 it cuts off the top of the tab. See here, in IE8 and Firefox 3.5:And in IE6, where it cuts off the top:Here is the XHTML it uses, for the top: <div class="tabber"> <div class="tabbertab" title="Payroll"> <h3>Oklahoma Payroll</h3> <p><h2 class="state" title="Oklahoma Payroll">Oklahoma Payroll</h2> <div class="stateTabCopy">Did you know that under Oklahoma law, independent contractors are exempt from the state's minimum wage of $6.85 an hour?</div> And the CSS: .tabberlive .tabbertabhide {
  11. aha... line-height:0;Why do people still use IE6?????????????
  12. That sounds like it would work, but it doesn't.I like the idea of using an image, but it creates an unwanted break for everything below.There has to be some way to get this to work...
  13. I have a div class set up like so: .footerTopGreenBar {background-color:#556c1a; width:100%; height:1px;} However in IE6, it shows this:Obviously not 1 pixel tall. I change the CSS to 10px and it stays the same height in my browser. Has anyone noticed this before and can possibly provide a solution?
  14. Ok, I am working towards a solution, and found that the display:block needed to be removed in order to fit all of the list items on one line. However, I am having a problem on the fly-out list item. When I rollover "Payroll Features", there is about 20pixels of space underneath the background. Seen here:I can't find anything in the CSS that would cause this extra space. Here is the part in the CSS specific to the flyout menu: .navmenu960 ul li ul li a.bckgroundarrow{background-image: url('/images/960/navigation/subnav-bckgroundarrow.gif'); background-repeat:no-repeat; height:25px; width:a
  15. Hi, I have a nav menu which looks like this on IE7, IE8 and Firefox 3.5:The nav menu is a simple unordered list, styled with CSS.However, in IE6 the nav menu looks very distorted. The first list item is on its own line, and the rest of the list items break onto a new line. See below:When I rollover a list item, the rollover state extends like 800 pixels, like this:Only two of the list items have a drop-down list as well, the first ("Payroll") and last ("About Us") items. Here's what I see when I rollover Payroll:Here is the XHTML: <div class="topnav_bckground"><div class="containe
  16. I am using a 960 grid system and have a 960px-wide image that I'm using as a "header" for my page. Instead of plopping the entire image on the page, I'd like to break it up into three pieces so I can link each piece individually. Piece 1 is 310px, piece 2 is 400px, and piece 3 is 250px, totalling 960px.My problem is that when I code each image on the page, like:<img src="1"><img src="2"><img src="3">the third image breaks onto a new line, while the first and second images have no space between them and align correctly.When I plop the entire 960px image onto the page, it fit
  17. Hi I have created a box in Photoshop, I've cut the top and bottom images and a 2px tall image as the background. I have an image inside the box that floats left with text on the right. It seems that once the text stops, the background image does as well. In IE it is fine, in FF I see this:Here is my XHTML: <img src="/images/960/global/grid8_stageboxtop.gif" style="margin-bottom:-4px;" /> <div class="grid8_stagebox"> <div class="grid8_stagebox-copy"> <h3 title="On-Boarding Checklists">On-Boarding Checklists</h3> <p>We provide general forms and checklists
  18. I am having an issue with floating an image to the left in FireFox. Here is how it looks in IE:Image floats to left while text is on right. However in FireFox the text is moved beneath the image, like this:Here is my XHTML: <div class="roundedStageBox"> <div class="roundedStageBoxImage"> <img src="/images/stage-sales-tools.gif" /> </div> <p style="width:200px;">Proven tips and suggestions to guide you in your payroll conversations.</p> </div> And the CSS: .roundedStageBoxImage {float:left; width:213px;}.roundedStageBox {background-image: url('/i
  19. Thanks, this code worked. I wouldn't have thought of using <span>... thanks a lot for your help.
  20. Hi, I have a simple unordered list with my own image for the bullets. In IE, it looks like this:But in FF, it looks distorted:My CSS is very simple: ul.silverArrow {list-style-image: url('/images/960/global/silverListArrow.gif'); vertical-align:top; line-height:17px;}ul.silverArrow li {margin-bottom:20px; vertical-align:top;} What is the problem here?
  21. yea that's a cool script. My site strictly uses jQuery so this isn't an option, but thanks for submitting your link,
  22. so like this?#inputwrap input[type=select] {border:0px;}
  23. I don't understand that code... like #inputwrap {input-type:select;}? That doesn't exist...
  • Create New...