I need two different values for the same property because of IE7

Discussion in 'CSS' started by co.ador, Nov 3, 2009.

0
  1. #1 
    .footer p{ position:relative;
vertical-align:baseline;
top:23px; 
left:0px; 
border:1px #000000 solid; 
background:#8B3E1D; 
color:#FACF96; 
width:auto;
height:15px;
background:#CC3300;

}
[if lt IE 7]

.footer p{top:43px;}
[endif]
    Code (markup):
    I need a top:23px; for Firefox, and top:43px; for IE7.

    is it alright the way I coded above?

    If have any suggestion please.
     
    co.ador, Nov 3, 2009 IP
  2. co.ador

    co.ador Peon

    Messages:
    120
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    This is what i have it might help some


    Right now I have a file called footer.php and i have the following simple code in it.


            
                 <div class="footer">
           <p><a href="../stores/index.php" >  www.store1.com </a>Copyright (c)2009</p> 

         </div>

</body>
</html>

</body>
</html>
    Code (markup):
    is that enough?

    is it now working that great.

    The CSS is 

      .footer {
 position:relative;
 top:310px;
 height: 3.5em;
 background-image:url(../images/header.gif);
 clear:right;
}
.footer p{ position:relative;
vertical-align:baseline;
top:23px; 
left:0px; 
border:1px #000000 solid; 
background:#8B3E1D; 
color:#FACF96; 
width:auto;
height:15px;
background:#CC3300;

}
.footer p a{ color:#FACF96; margin-right:10px; }
<!--[if lt IE 8]>

<!--[endif]-->
    Code (markup):
    and another page called header.php

    
<!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" />
<link type="text/css" href="../stylesheets/webpageprueba.css" rel="stylesheet" media="all" />
<title>ShoesStore</title>
<body>
    Code (markup):
    but it is not working that good because it is not displaying in the bottom of the page but behind the form...

    having some difficulties and I need some help

    in store.php I have added the files header.php and footer.php through the include function as below, is that ok?

    

<?php include("../includes/header.php"); 
?>
<form action="example.php"> 
<fieldset class="primero">
<legend>Search For a store</legend> 
 
<fieldset>  
<legend>Postal Address</legend>  
<label for="street">Street address</label>  
<input id="street" name="street" type="text" />  
<label for=" suburb">Suburb</label>  
<input id="suburb" name="suburb" type="text" />  
<label for="state">State</label>  
<input id="state" name="state" type="text" />  
<label for="postcode">Postcode</label>  
<input id="postcode" name="postcode" type="text" />  
</fieldset>

<fieldset class="tercero" style="border-color:#FFFFFF" >
<legend>Services</legend> 
<ol>
<li>
  <input type="checkbox" name="example" value="delivery" />Delivery<br />
  <input type="checkbox" name="example" value="tv" />Tv<br />
  <input type="checkbox" name="example" value="parking" />Parking<br />
</li></ol>
</fieldset>
</fieldset> 
<fieldset>  

<?php include("../includes/footer.php"); 
?>
    Code (markup):
    I think the problem should be here 

    <div class="footer">
           <p><a href="../stores/index.php" >  www.store1.com </a>Copyright (c)2009</p> 

         </div>
    Code (markup):
    thank you gary hope that helps guys...
     
    co.ador, Nov 3, 2009 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #3
    As a rule, if you are having to relative position a P, and force feed different values to each browser, you are probably using the wrong markup AND the wrong CSS in the first place... Are you using a CSS reset? Why is that href in a paragraph tag in the first place since it's not flow text? Why are you using relative positioning instead of margins and padding? What effect are you expecting vertical-align to have on CDATA? Why would you declare a 15px height on a block level container that's around non-px metric fonts and inside a EM metric wrapping DIV?!?

    Do you have a live copy of what it is you are trying to achieve? Right now, I've got the feeling you have overcomplicated something REALLY simple. If you are resorting to 'position:relative; top:310px' on your FOOTER, you likely are using completely broken/incorrect site building techniques.

    Of course that your links are uptree likely means your directory structure is completely borked too.

    The question is, what is this supposed to look like? Do you have a link to the whole page? I suspect that all this relative positioning malarkey is what's biting you in the backside. Whatever this is for a layout, you've over-thought your markup and your CSS.
     
    deathshadow, Nov 3, 2009 IP