Advanced Search

Results 1 to 3 of 3

Thread: IE7 issues

  1. #1
    Join Date
    Nov 2010
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question IE7 issues



    My page is working fine in everything else except IE7 (and some in IE6). I have some hacks at the bottom of the CSS.

    You can view it here or code below: http://www.dvdgalleria.com/form/on_site.html

    Any help to untangle IE7 most of all would be appreciated. It might help IE6 issues...

    Thanks in advance!

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>on_rent_com_site_2</title>
    <style type="text/css">
    * {
    	margin:0;
    	padding:0;
    	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    }
    #inner_wrapper {
    	background:url(web_developer_test_blank.jpg) no-repeat;
    	height:100%;
    	width:60%;
    	padding:0 0 0 15px;
    	overflow:auto;
    	min-height: 303px;
    	height: auto;
    }
    #inner_wrapper /* div#moving_form_header {margin:0 0 0 -7; position:relative; display:inline-block; } */ 
    
    div.form_row {
    	clear:both; height:15px;
    }
    div.form_row div {
    	float:left;
    	padding:0px 6px 0px 0px;
    	margin:0px;
    	font-size:.8em;
    	
    }
    div.form_row div.zip {
    	padding:0px 14px 0px 0px;
    }
    .submit_button {
    	margin:14px 0px 0px 0px;
    }
    #residence {
    	width:40px;
    }
    #rooms {
    50px;
    }
    div#form_wrapper {
    	width:200px;
    	padding:7px 0 0 0;
    	float:left;
    	margin:0 0 0 40px;
    	display:inline;
    }
    div#form_wrapper p {
    	padding:5px 0px 2px 0px;
    	margin:0px;
    	clear:both;
    	font-size: 0.9em;
    }
    div#form_wrapper #submit_btn {
    	margin:0;
    	padding:0;
    	clear:both;
    }
    div#form_wrapper #submit_btn input {
    	margin:	25px 0 0 -5px;
    	position:relative;
    }
    div#form_wrapper p.move_type {
    	padding-top:0px;
    	font-size: .8em;
    }
    #move_type_field {
    	width:90px;
    }
    div#form_wrapper a {
    	color:#6a8da9;
    	font-size:10px;
    	display:block;
    	line-height:12px;
    	padding:2px 0 0 0;
    }
    .moveform_auto, #residence_type {
    	display:block;
    }
    .moveform_auto {
    	padding:4px 0 0 0;
    	margin:0;
    }
    .moveform_auto input {
    	margin:2px 0 2px 0;
    	padding:0;
    }
    #residence_row, #vehicle_row {
    	padding-top:0px;
    	display:inline-block;
    }
    #checklist {
    	float:left;
    	height:280px;
    	width:165px;
    	padding:0px 0 0 63px;
    	margin:-3px 0px 0px 0px;
    	color:#999999;
    	background-image:url(difference_box.jpg) no-repeat;
    	font-size:0.9em;
    }
    #the_difference_box {
    	float:right;
    	width:165px;
    	text-align: left;
    	border: 1px solid #d5e2ea;
    	margin-top: 10px;
    	line-height: .95em;
    	font-family: Arial, Helvetica, sans-serif;
    	color:#383838;
    	background-color: #fff;
    	padding: 8px 10px 15px 12px;
    	margin-right: 15px;
    	height: 212px;
    }
    
    .the_difference {
    	font-size:1em;
    	font-weight:bold;
    	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    	color:#666;
    	margin-top:2px;
    }
    .safety, .quality, .security, .privacy, zipcode_finder {
    	margin-bottom:8px;
    	font-size: .8em;
    }
    .safety {
    	margin-top:5px;
    }
    .security {
    	margin-bottom:3px;
    }
    .start_quotes {
    	font-style:italic;
    	font-weight:bold;
    	color:#6a8da9;
    	font-size:1.1em;
    	text-align: left;
    	margin-top:15px;
    	margin-left:35px;
    	font-style:italic;
    }
    move_date {font-size:.8em;}
    .which_is_right {display:inline-block; float:right;}
    .em8 {font-size:.8em}
    #month {width:80px;}
    #day {width:30px;}
    .approximate{font-size:.8em; color:#777;}
    #zip_from, #zip_to {
    	width:70px;
    }
    #num_rooms {margin-left:6px; float:left; display:inline-block;}
    #num_room_field { width:70px;}
    </style>
    <!--[if IE 8]>
    <style type="text/css">
    #checklist{	padding:0px 0 0 55px;
    	margin:-3px 0px 0px 0px;}
    </style>
    <![endif]-->
    
    <!--[if IE 7]>
    <style type="text/css">
    #checklist{	padding:0px 0 0 25px;
    	margin:-3px 0px 0px 0px;}
    </style>
    <![endif]-->
    
    <!--[if IE 6]>
    <style type="text/css">
    #checklist{	padding:0px 0 0 25px;
    	margin:-5px 0px 0px 0px;
        }
    </style>
    <![endif]-->
    
    
    <script type="text/javascript">
    function hide(obj)
      {
          obj1 = document.getElementById(obj);
          obj1.style.display = 'none';
      }
    function show(obj)
      {
          obj1 = document.getElementById(obj);
          obj1.style.display = 'block';
      }
    
    function show_auto(optionValue) {
     if(optionValue == 'auto') {
       document.getElementById('vehicle').style.display = '';
       document.getElementById('residence_type').style.display = 'none';
       document.getElementById('num_rooms').style.display = 'none';
     } else {
       document.getElementById('vehicle').style.display = 'none';
       document.getElementById('residence_type').style.display='';
       document.getElementById('num_rooms').style.display='';
     }
    }
    
    </script>
    </head>
    <body onload="hide('vehicle');">
    
    <div id="inner_wrapper">    
     <div class="start_quotes">Start getting your free moving quotes</div>
     
     <div id="form_wrapper">
      <div class="form_row">
        <p class="move_type">
          <label for="moving-move_type">Select Your Move Type</label>
        </p> 
        <p class="which_is_right"><a href="#" >Which is right for me?</a></p>
        <select name="moving-move_type" id="move_type_field" onchange="show_auto(this.value)">
          <option>Select</option>
          <option value="full" class='list'>Full</option>
          <option value="self" class='list'>Self</option>
          <option value="auto" class='list'>Auto</option>
        </select>
       </div>
        <p>
          <label for="move_date" class="move_date em8">Move Date</label>
          <span class="approximate">(approximate)</span>
        </p>
        
        <div class="form_row">
          <div id="move_date">
            <input name="move_month" id="month" value="" />
            <input name="move_day" id="day" value="" />
          </div>
        </div>
        
        <div class="form_row">
          <div class="zip">
            <p>
              <label for="moving-from_zip">Moving From</label>
            </p>
            <input value="" name="moving-from_zip" type="text" id="zip_from" />
            <a href="#">ZIP Code Finder</a> 
          </div>
          <div>
            <p>
              <label for="moving-to_zip">Moving To</label>
            </p>
            <input value="" name="moving-to_zip" type="text" id="zip_to" />
            <a href="#">ZIP Code Finder</a> 
          </div>
        </div>
        
        <div style="clear:both; height:7px;"></div>
        
        <div class="form_row" id="residence_row">
      <div id="residence_type">
                <label for="residence_type">Residence type<br />
                  <select name="residence_type" id="residence_Type">
                      <option value="select" class="select">Select</option>
                      <option>Apartment</option>
                      <option value="condo">Condo</option>
                      <option value="single_family">Single Family</option>
                  </select>
                </label>
          </div>
      <div id="num_rooms">
                <label for="num_rooms"># of Rooms<br />
                  <select name="num_rooms" id="num_room_field">
                      <option value="Select" class="select">Select</option>
                      <option value="one">1</option>
                      <option value="two">2</option>
                      <option value="three">3</option>
                  </select>
                </label>
              </div>
        </div>
        <div class="form_row" id="vehicle_row">
          <div id="vehicle">
            <label for="vehicle">Vehicle<br />
                  <select name="year" id="year" style="width:55px;">
                    <option>Year</option>
                    <option value="year">year</option>
                  </select>
                  
              <select name="make" id="make" style="width:60px;">
                <option>Make</option>
                <option value="make">make</option>
              </select>
                  
    <select name="model" id="model" style="width:63px;">
                          <option>Model</option>
                          <option value="model">model</option>
              </select>
            </label>
          </div>
          
        </div>
        <div id="submit_btn">
          <input name="submit" value="move" type="image" src="btn_continue_s1.gif" width="135" height="34" alt="Continue" id="btn_continue_car" style="margin-bottom:5px;" />
        </div>
        <!--<div class="spacer"><img src="http://media.rent.com/img/trans.gif" width="1" height="1" alt="" /></div>
     --> 
      </div>
      <div id="checklist"> 
        <div id="the_difference_box">
          <div class="the_difference">The Difference</div>
          <div class="safety"><strong>Safety</strong> &ndash; Our network consists of only fully licensed and insured movers.</div>
          <div class="quality"><strong>Quality</strong> &ndash; All our moving companies must pass our strict 28-point inspection process to insure quality service.</div>
          <div class="security"><strong>Security</strong> &ndash; GigaMoves does not permit moving companies to broker or sell customer information.</div>
          <div class="privacy"><a href="#">Privacy Policy</a></div>
        </div>
      </div><!-- end form_wrapper -->
    </div><!-- end inner_wrapper -->
    </body>
    </html>

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,882
    Thanks
    16
    Thanked 288 Times in 287 Posts
    Blog Entries
    4

    Default

    Not exactly sure what your asking. If you want help with IE stylesheets, try here: css-tricks.com/how-to-create-an-ie-only-stylesheet/
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  3. #3
    Join Date
    Nov 2006
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    672
    Thanks
    1
    Thanked 110 Times in 108 Posts

    Default

    A possible solution to this problem has been posted here...

    coothead

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
  •