0

I m trying to make a template for my website. there is a top box and a navigation box. Position of navigation box is relative to top box and at a 5% of distance from top box. This distance is visible in Internet explorer but in mozilla navigation box appears right after the top box. No gap between both.

How can i show gap between the two bars in mozilla as well.

Also contents of navigation bar are horizontally in center but not vertically. and i cant set them in middle. How can i do that?

<!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=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color:#FFFFFF
}
.top {
	background-image: url(top.gif);
	background-repeat: repeat-x;
	height: 92px;
	border: 1px solid #CCCCCC;
}
.logo {
	top: 40px;
	position: relative;
	left: 20px;
}
.nav {
	background-image: url(nav_back.gif);
	background-repeat: repeat-x;
	position: relative;
	top: 5%;
	border: 1px solid #CCCCCC;
	height: 50px;
	right: 5%;
	width: 90%;
	left: 5%;
	text-align: center;
	vertical-align: text-bottom;
	z-index: 0;
}
.nav_right{
	background-image: url(nav_right.gif);
	height: 52px;
	position: absolute;
	background-repeat: no-repeat;
	right: -30px;
	width: 30px;
	z-index: 1;
	clip: rect(auto,auto,auto,auto);
	top: 0px;
	bottom: 0%;
}
.nav_left{
	background-image: url(nav_left.gif);
	height: 52px;
	position: absolute;
	background-repeat: no-repeat;
	left: -5px;
	width: 30px;
	z-index: 1;
	clip: rect(auto,auto,auto,auto);
	top: 0px;
	bottom: 0%;
}

-->
</style>
</head>

<body>

<div class="top"><img class="logo" src="logo.gif"/></div>
<div class="nav">abc<div class="nav_left"></div><div class="nav_right"></div>
</div>

</body>
</html>
3
Contributors
2
Replies
3
Views
7 Years
Discussion Span
Last Post by almostbob
0

use padding and position body with relative too

Edited by fatihpiristine: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.