Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Junior Member
    Join Date
    Feb 2009
    Posts
    4
    Member #
    18411
    Hi everyone. I'm a new member here. This looks like a great forum! I look forward to learning a lot here.

    I just took my first job in web development. I'm admittedly kind of a novice, but that is OK. Plenty of time to learn. I'm working on changing the login from example one to example two:

    [1] http://www.recordpub.com
    [2] http://devserver.recordpub.com

    I'm having a problem with the advanced search box on the right. It seems IE wants to kick this box out to the right, while Firefox wraps it to the left of the containing LI. It is making it impossible to align that box. I've been working on it off and on for a day now with no luck. Does anyone have any ideas?

    If you're using Firebug or a comparable program, the files in question are:
    dropmenu.css
    dropmenu.js

    I'd sincerely appreciate any help.

  2.  

  3. #2
    Senior Member
    Join Date
    Dec 2008
    Posts
    483
    Member #
    17875
    Liked
    1 times
    Hi, Im not going to go into specifics.
    But this may help you.

    HTML Code:
    <link rel="stylesheet" type="text/css" href="dropmenu.css"/>
    <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="dropmenuIE.css"/>
    <![endif]-->
    dropmenu.css
    -----------------
    #advancedSearchBox{right: 50px;}

    dropmenuIE.css
    -----------------------
    #advancedSearchBox{right: 80px;}

    Since stylesheets cascade, the dropmenu.css is applied to the page
    IE will parse the <!--[if IE]>, other browsers will ignore this comment block.
    In IE, the 2nd stylesheet link will be parsed and included, and its stylings will override any stylings in the original.

    you can also do this
    link your dropmenustylesheet
    <!--[if IE]>
    <style>
    #advancedSearchBox{right: 80px;}
    </style>
    <![endif]-->

    i usually make a stylesheet called styleIE.css and put this between conditional comments in every page, then i override w/e styles i need to to display properly in IE

    gluck! hope i helped

  4. #3
    Junior Member
    Join Date
    Feb 2009
    Posts
    4
    Member #
    18411
    That did help. I was curious as to whether or not there was an obvious style I could apply that would negate the necessity of having browser-specific stylesheets, but I'm content with the easy way out at this point.
    Thanks again!

  5. #4
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    I'm not 100% sure which part you are referring to. Could you maybe post a couple of screenshots indicating what you expect and what is happening in IE?

    I'm also a fan of avoiding browser-specific styles if possible

  6. #5
    Junior Member
    Join Date
    Feb 2009
    Posts
    4
    Member #
    18411
    Gladly! Firefox: Attachment 3060 and IE: Attachment 3061

    The drop down functionality is done using unordered lists. Seems like on that right side, IE wants to kick the hidden content to the right of the containing LI without putting it below. Firefox puts it below the content and wraps it to the left of the containing LI. Quite a discrepency in the way the browsers handle the same code.

    I expected the Firefox outcome, which would have been easy enough to deal with. Set the left margin to a certain number of pixels (115 I believe) and call it a day.
    Attached Images Attached Images

  7. #6
    Junior Member
    Join Date
    Feb 2009
    Posts
    4
    Member #
    18411
    OK, so somewhere in the process of editing this stuff I screwed my styling up.

    http://devserver.recordpub.com

    Why isn't the search link staying next to that input field? I didn't specify a line break! GRRRRR :dead:


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 05:11 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com