38 users online (0 members and 38 guests)  


Page 1 of 2 1 2 Last
  Results 1 to 15 of 24

Related

  1. How to build a url using input text boxes    Forum: Javascript Forum
    Replies: 0
  2. Replies: 4
  3. Background-color problem    Forum: CSS Forum
    Replies: 1
  4. background-color and NetScape 7 problem    Forum: CSS Forum
    Replies: 1
  5. Replies: 2
  1. #1
    pheck's Avatar
    New User

    Status
    Offline
    Join Date
    Aug 2003
    Location
    San Franny
    Posts
    17

    input boxes background color problem

    Hi,

    Please see this link:

    http://www.doctoredmedia.com/sportsMedicine/website/site/index.php?section=home&email=true

    It's a site I'm working on. I can't figure out why the input boxes have a yellowish background color. Interestingly, when I change the CSS so that the input boxes have a black background, I see a flash of black when I reload the page before it turns ugly yellow. Here is the code in my style sheet for the input boxes:

    Code:
    .txtBox {
        border: 1px solid #003366;
        background-color: #B9C4F2;
        font-family: verdana, arial, helvetica, sans-serif;
        font-size: 8pt;    
        color: #003366;
        background-image: url('../images/boxShadow.gif');
    }
    and here is my HTML for the input box:

    Code:
    <input name="yourEmail" type="text" style="width:125;height:18;" class="txtBox" size="10">
    any insights into this are much appreciated. Thanks.

  2. #2
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    Far from a CSS expert, but try background: instead of background-color:

    Dave

  3. #3
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732
    Hi there pheck,

    When I visit your site http://hstrial-dbayly.homestead.com/files/pheck1.jpg this is what I see in IE6.0 and Netscape7.1.

    When I use the the code that you have posted http://hstrial-dbayly.homestead.com/files/pheck.jpg this is what I see

    I haven't checked your source code as yet. I will try and look at it as soon as I am able.

    coothead

  4. #4
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732
    Hi there pheck,

    I could see nothing wrong in your source codes, so I had a quick look in my bible
    ...if you set a background-color for the element as well,
    the color appears if the image fails to load;
    otherwise, the image overlays the color.

    Transparent pixels of the image allow a background color to show through.
    I would suggest that you try removing background-color:#b9c4f2; or perhaps replacing it with background-color:#ffffff;

    coothead

  5. #5
    pheck's Avatar
    New User

    Status
    Offline
    Join Date
    Aug 2003
    Location
    San Franny
    Posts
    17
    Hi coothead,

    Thanks for taking those screenshots and commenting. I hope that "pheck" didn't actually show up in your browsers in the input area, did it?!?! You just put that in there to remind yourself it was an image for me, right? <--stupid naive question I'm sure.

    It's strange because on my Netscape 7.1 I see what you see initially but in the latest IE I see yellow. When I remove the CSS reference completely (so the input box has no style), I get a standard input box but it is ALSO yellow! Could it be something else in my CSS file that is messing things up? Here is the whole CSS:

    Code:
    body {
    scrollbar-face-color: #2A537B;
    scrollbar-arrow-color: #003366;
    scrollbar-track-color: #003366;
    scrollbar-shadow-color: #003366;
    scrollbar-highlight-color: #3562B5;
    scrollbar-3dlight-color: #B9C4F2;
    scrollbar-darkshadow-Color: #003366;
    }
    p, ul, ol {
    	font-family: verdana, arial, helvetica, sans-serif;
    	font-size: 10pt;
    	color: #003366;
    }
    p.footer {
    	font-family: verdana, arial, helvetica, sans-serif;
    	font-size: 7pt;
    	color: #003366;
    }
    h1 {
    	font-family: verdana, arial, helvetica, sans-serif;
    	font-weight: bold;
    	font-size: 11pt;
    	color: #B9C4F2;
    	background-color: #3562B5;
    }
    h2 {
    	font-family: verdana, arial, helvetica, sans-serif;
    	font-size: 8pt;
    	color: #B9C4F2;
    	background-color: #3562B5;
    }
    a, a:visited, em {
    	font-family: verdana, arial, helvetica, sans-serif;
    	font-weight: bold;
    	font-style: normal;
    	text-decoration: none;
    	font-size: 10pt;
    	color: #003366;
    	background-color:  none;
    }
    .dropDown {
        border-top: 1px solid #003366;
        border-bottom: 1px solid #003366;
        border-left: 1px solid #003366;
        border-right: 1px solid #003366;
        background-color: #2A537B;
        font-family: verdana, arial, helvetica, sans-serif;
        font-size: 8pt;    
        color: yellow;		
    }
    .txtBox {
        border: 1px solid #003366;
        background-color: #B9C4F2;
        font-family: verdana, arial, helvetica, sans-serif;
        font-size: 8pt;    
        color: #003366;
        background-image: url('../images/boxShadow.gif');
    }
    .txtArea{
        border-top: 1px solid #003366;
        border-bottom: 1px solid #003366;
        border-left: 1px solid #003366;
        border-right: 1px solid #003366;
        background-color: #B9C4F2;
        font-family: verdana, arial, helvetica, sans-serif;
        font-size: 8pt;
        color: #003366;
    }
    thanks again for looking.

  6. #6
    pheck's Avatar
    New User

    Status
    Offline
    Join Date
    Aug 2003
    Location
    San Franny
    Posts
    17
    also, this is the color of the background in my input box. so strange.

    #FFFFA0

  7. #7
    pheck's Avatar
    New User

    Status
    Offline
    Join Date
    Aug 2003
    Location
    San Franny
    Posts
    17
    nailed it. my directory call was wrong in my style sheet. should have been images/boxShadow.gif instead of ../images/boxShadow.gif. Still get the yellow with no style applied on this machine, but no yellow on other machines. anyway, problem solved. thanks for your efforts!

  8. #8
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732
    Hi there pheck,

    Glad to here that that you have got the problem solved
    I was coming to the conclusion also that it was a problem
    with the url after retesting your site.

    While testing I made a resized copy of the dropShadow.gif
    and popped into your css .txtArea. Check it out http://hstrial-dbayly.homestead.com/files/pheck2.jpg
    I think that it will complement the upper three boxes well

    coothead

  9. #9
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    coothead, just incase you are not aware, you can upload images in your reply here. The images will show as a clickable thumbnail, saving you discspace and also assuring that the image will be available for others that may have similar problems at a later time.

    In order to upload you must use the standard reply button and not the "quick reply"

    Dave

  10. #10
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732
    Hi there Dave,

    Thanks for the that information, my old eyes are not what they used to be
    and I missed the attach files option when exploring the facilities here.
    This will save a lot of messing around

    I have attached the three previous images here just by way of a test

    coothead
    Attached Images Attached Images

  11. #11
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732
    Hi there Dave,

    The attachments facility will, obviously, be useful in certain circumstances,
    but I think that in the context of this thread,
    I was better off using my site for illustration

    coothead

  12. #12
    pheck's Avatar
    New User

    Status
    Offline
    Join Date
    Aug 2003
    Location
    San Franny
    Posts
    17
    guys,

    thanks again for all the good suggestions. wondering why my input boxes were yellow? because i just downloaded and installed the new googlebar which has the autofill function! i didn't realize it until i was buying something online tonight, but it changes the input boxes it knows how to fill out to yellow! the googelbar is awesome for filling out forms, but it sure gave me a headache last night and this morning. i decided to not go with the background images after playing with them some more. thanks again. hopefully this will help others who search the web when their new googlebar messes up their designs!

  13. #13
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732
    Hi there Dave,

    I really must apologize for my stupidity,
    as I totally missed this in your post
    The images will show as a clickable thumbnail,
    I just saw the meagre images
    In future, I think that I will take a little more water with my beverage

    coothead

  14. #14
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    I was wondering what you meant by
    I think that in the context of this thread,
    I was better off using my site for illustration


    Dave

  15. #15
    sjaleel's Avatar
    New User

    Status
    Offline
    Join Date
    Sep 2003
    Posts
    2

    Lightbulb yellow input box error

    Hi there,

    I've had the similar problem recently and the problem was traced back to an installation of Googlebar. The new version comes with an "auto-fill" option, which if enabled, highlights certain text boxes with that annoying yellow color, basically to show, that its capable of remebering these field values and fill them in automatically next time.

    I've had a frustrating time trying to figure out why it was doing that, and thought I'd report my findings, IF this is the same case as yours...

    Disabling the auto-fill option fixes the problem immediately.

    Cheers!
    Sam.



    Quote Originally Posted by pheck
    nailed it. my directory call was wrong in my style sheet. should have been images/boxShadow.gif instead of ../images/boxShadow.gif. Still get the yellow with no style applied on this machine, but no yellow on other machines. anyway, problem solved. thanks for your efforts!



Page 1 of 2 1 2 Last

Tags for this Thread