View Single Post

kpm547 · #3 (**permalink**) May 18th, 2005, 18:57

I tried that but it don't seem to work. I have solved some of the problems, but I still have one. It displays correctly in FF, but not in IE. What do I need to do to extend the titlebar over to the right of the main div?

Here's my css:

Code: Select all

html, body {
	height:100%;
	color:#19428F;
	font-family : Tahoma;
}

#main {
	position:absolute;
	left:10%;
	top:0px;
	width:80%;
	height:100%;
	background-color: #F5F7DC;

}



#Logo {
	position:absolute;
	left:0px;
	top:3px;
	width:201px;

}



#Titlebar {
	position:absolute;
	left:201px;
	top:24px;
    right:0;
	height:64px;
	background-image: url(images/Barspace.gif);
	background-repeat: repeat-x;
}





#MenuBar {
	position:absolute;
	left:201px;
	top:88px;
	right:10%;
	height:27px;
	background-image : url(images/MenuBar.gif);
	background-position : left;
	background-repeat : no-repeat;
}



#footer {
	position:absolute;
	bottom:0;
	
	left:0;
	height:5%;
	width:100%;
	right:0;
	max-height:5%;
	font-size:75%;
	text-align : center;
	color : #FBF38D;
	padding : 10px 0 0 0;
	background-color : #19428F;
}

#content {
	position:absolute;
	top:115px;
	left:204px;
	right:0;
	padding: 10px 10px 10px 10px;
	
}
#leftbar {
	position:absolute;
	top:115px;
	left:0;
	width:204px;

}

And here's the HTML:

Code: Select all

<html>
<head>
<title>Lethbridge Area Search and Rescue Association</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css"
href="lasarastyle.css" />






<script type="text/javascript"
        src="udm-resources/udm-custom.js"></script>
<script type="text/javascript"
        src="udm-resources/udm-control.js"></script>

<script type="text/javascript"
        src="udm-resources/udm-style.js"></script>


</head>
<body style="background-color:#F5F7DC; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">

<div id="main">

<div id="Logo">
        [img]images/Logo.gif[/img]
</div>

<div id="Titlebar">
        [img]images/Titlebar.jpg[/img]
</div>

<div id="MenuBar">

<ul id="udm" class="udm">
[*]About
        [*]Recruitment

        [*]Training
                <ul>[*]Courses
                  [*]Training Info
                  
[*]Meetings
                  [*]GPS
                  [/list]
        [*]Operations

                <ul>[*]Call Out
                  [*]Equipment List
                  [/list]        [*]Fundraising

                <ul>[*]Fundraising Info
                  [*]Supporters
                  [/list]        [*]Resources

                <ul>[*]Photo Gallery
                  [*]Links
                  [/list]        [/list]
<script type="text/javascript"
        src="udm-resources/udm-dom.js"></script>

</div>


<div id="leftbar">
</div>
<div id="content">
This is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content areaThis is the content area

</div>
<div id="footer">
Lethbridge Area Search and Rescue Association

Copyright 2005

</div>

</div>

</body>
</html>

The page can be viewed here in action www.lasara.org/lasaratest/