SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Addict Jakob's Avatar
    Join Date
    Aug 2002
    Location
    Denmark
    Posts
    270
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS challenge in IE7

    I hope someone can help me out.

    On http://www.fengshuicrazy.com I have a newsletter sign up form which looks great in IE8 and Firefox 3.

    But for some reason IE7 makes horisontal and vertical scroll bars around the form which is a javascript snippet from my newsletter provider (aweber).

    My style sheet is located here: http://www.fengshuicrazy.com/style.css

    Thanks in advance :-)
    Learn more about Solar Panel Installation

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hi, the problem is that IE7 is expanding the <div>s around the form elements and as a result it's too wide . You could just remove the overflow:auto rule on "#af-form-1436387315"

    If you don't have control over that stylsheet, just set the rule in yours
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  3. #3
    SitePoint Addict Jakob's Avatar
    Join Date
    Aug 2002
    Location
    Denmark
    Posts
    270
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    Thanks a lot. And you're right - I don't control the css for the script.

    Would I just have to put in overflow:hidden then?
    Learn more about Solar Panel Installation

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    No just do what I said (if you don't know the default value then sorry) . Open up your stylesheet and then reset it
    Code:
    #af-form-1436387315{overflow:visible;/*default value*/}
    Make sure your stylesheet comes later then the JS which you are inserting.

    If that isn't possible (The JS is outside the <head>) then just add !important or just add specificity somehow. Aka
    Code:
    div #af-form-1436387315{overflow:visible;}
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •