No replies
lws009
lws009's picture
Offline
newbie
Last seen: 11 years 36 weeks ago
Timezone: GMT+1
Joined: 2010-02-09
Posts: 1
Points: 2

dear members of css creator,

I'm working on a site about a street theater show from some friends of me.
But, now i'm placing images on top of an existing image (going to be a img rotator in php)
But, it looks oke in firefox, in ie but on a safari browser it is always a little to much to the bottom.
But, my friends both use a mac with safari so it really has to work good on it.

You guys got any idea what the problem is?

My regards,
Michiel

P.S; example is: site

@charset "UTF-8";
 
 
body {
background-color:#993300;
}
 
#container {
margin: 0px auto;
background-image: url(images/background.jpg);
height: 600px;
width: 800px;
}
 
 
#menu{
position: relative;
top: 180px;
left: 50px;
width: 120px;
color:#FFFFFF;
}
li{
list-style-type:none;
margin-bottom:2px;
}
#menu a{
text-decoration:none;
color: #FFF;
}
#menu a:hover{
text-decoration: underline;
color: #999999;
}
 
 
#fotoL{
position:absolute;
height:128px;
width: 154px;
/*margin-top: 140px; !important*/
margin-left: 165px;
padding-top: 145px;
}
#fotoR{
position: absolute;
height:128px;
width: 154px;
margin-left: 330px;
margin-top: 150px;
}

<!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>TheGBC - index</title>
<link href="reset.css" rel="stylesheet" type="text/css" />
<link href="css.css" rel="stylesheet" type="text/css" />
</head> 
 
<body>
<div id="container">
	<div id="menu">
		<ul>
        	<li><a href="#">Home</a></li>
            <li><a href="#">Video</a></li>
            <li><a href="#">Foto</a></li>
            <li><a href="#">Show</a></li>
            <li><a href="#">Contact</a></li>
            <li><a href="#">Info</a></li>
            <li><a href="#">Agenda</a></li>
            <li><a href="#">Bedankt</a></li>
        </ul>
	</div>
    <div id="fotoL">
    <img src="images/fotoL1.jpg" alt="sfeerfoto1" />    </div>
        <div id="fotoR">
    <img src="images/fotoR1.jpg" alt="sfeerfoto2" />    </div>
</div>
</body>
</html>