SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist
    Join Date
    Jun 2010
    Location
    Israel
    Posts
    523
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    BG color gets out of fieldset's border in IE7/8

    I'm trying to give a background color to a fieldset but when i do the background gets out of the fieldset's top border in IE7/8 only as in the image below:


    In any other browser it works just fine, I think its because of the legend tag but i cant seem to find a solution, any ideas?

    HTML:
    Code HTML4Strict:
    <form id="general-form" action="/register" method="post">
    <fieldset>
    <legend>פרטי משתמש</legend>
    <div>
    <label for="email"><span>*</span> אימייל</label>
    <input type="text" id="email" name="email" autocomplete="off" maxlength="50" value="<?php echo $email; ?>" />
    </div>
    <div>
    <label for="pass"><span>*</span> סיסמה</label>
    <input type="password" id="pass" name="pass" autocomplete="off" />
    </div>
    <div>
    <label for="repass"><span>*</span> אימות סיסמה</label>
    <input type="password" id="repass" name="repass" />
    </div>
    </fieldset>
    <fieldset>
    <legend>פרטים כלליים</legend>
    <div>
    <label for="firstname"><span>*</span> שם פרטי</label>
    <input type="text" id="firstname" name="firstname" maxlength="20" value="<?php echo $fname; ?>" />
    </div>
    <div>
    <label for="lastname"><span>*</span> שם משפחה</label>
    <input type="text" id="lastname" name="lastname" maxlength="20" value="<?php echo $lname; ?>" />
    </div>
    <div>
    <label for="phone"><span>&nbsp;</span> טלפון</label>
    <input type="text" id="phone" name="phone" maxlength="20" value="<?php echo $phone; ?>" />
    </div>
    </fieldset>
    <fieldset>
    <legend>&nbsp;</legend>
    <div class="freetext">
    <input type="checkbox" name="subscribe" class="checkbox" checked="checked" />
    <span>אני מסכים לקבל חדשות <a href="#">ועדכונים</a> לאימייל</span>
    </div>
    <div id="submit">
    <label><span>&nbsp;</span></label>
    <input type="submit" name="submit" value="שלח" />
    </div>
    </fieldset>
    </form>

    CSS:
    Code CSS:
    #general-form {margin-right:10px}
    #general-form fieldset {padding:10px 0;background-color:#dee6e8;width:360px;margin-bottom:10px;border:1px solid #B6C9CD}
    #general-form legend {font-size:20px;color:#5b6e77;font-weight:bold;margin-right:10px}
    #general-form div {margin-bottom:10px;position:relative;width:100%}
    #general-form label {float:right;width:150px;font-weight:bold;font-size:15px;margin-right:10px;line-height:25px}
    #general-form label span {color:#F00;font-size:17px;padding-left:5px}
    #general-form input, #general-form textarea, #general-form select {width:170px;height:25px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:3px 5px;border:1px solid #B6C9CD;font-size:15px}
    #general-form select {padding:0}
    #general-form textarea {height:150px;resize:none}
    #general-form #submit input {width:170px !important;font-size:15px !important;height:25px !important}
    #general-form .freetext {margin-bottom:5px}
    #general-form .freetext span {margin-right:3px;color:#336c83;font-size:15px;vertical-align:top}
    #general-form .freetext a {vertical-align:top}
    #submit:hover:before, #submit:hover:after {display:none}
    #general-form .checkbox {width:auto;height:auto;margin-right:15px;padding:0}

  2. #2
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,454
    Mentioned
    61 Post(s)
    Tagged
    2 Thread(s)

  3. #3
    Galactic Overlord gold trophysilver trophybronze trophy
    HAWK's Avatar
    Join Date
    Aug 2003
    Location
    New Zealand
    Posts
    12,490
    Mentioned
    941 Post(s)
    Tagged
    14 Thread(s)
    Hi @ulthane ;
    We're testing a new product that we've built at SitePoint to help people fix broken CSS live. Your problem looks like one that we could easily help you fix on the spot.
    One of our CSS experts is online now and ready to help if you're keen to give it a go.

    Edit: I'm removing the link to the product while we fine tune and develop further. Will keep you posted.
    Last edited by HAWK; Feb 26, 2013 at 21:29.


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
  •