PDA

View Full Version : Placing table at top to repeat HELP


dezamp
March 2nd, 2007, 03:07 PM
What I am really struggling to make is a banner like the yellow thing at the top of odeo.com (http://www.odeo.com). I have the text and the layer but just can't get it to be at the absolute top with no gap, and touch both sides, left and right.
thats all folks
March 2nd, 2007, 04:02 PM
Are you using CSS or a table

table: you could set the width to 100% and in CSS: width:100% for the div that holds the information (Text)
dezamp
March 3rd, 2007, 05:11 AM
Are you using CSS or a table

table: you could set the width to 100% and in CSS: width:100% for the div that holds the information (Text)

I have a div and am using css to control its features.

The width:100% thing doesn't seem to work
biznuge
March 3rd, 2007, 08:12 AM
why not just use Odeo.com's styling......?


<html>
<head>
<style>
* {
margin:0px;
padding:0px;
}
#see-also-bar {
font-family:Arial, Helvetica, sans-serif;
width:100%;background:#FCFEBB;border-bottom:solid 1px #89B1C6;
padding:5px 0 5px 0;
text-align:center;
color:#333;
font-size:90%;
}
</style>
</head>
<body>
<div id="see-also-bar">
<em><b>Hey!!!</b></em> It really does work... <a href="http://www.youknowsit.co.uk/">ClArT!</a>.
</div>
</body>
</html>


Probably the easiest way I can think of doing it.... lol :P
dezamp
March 4th, 2007, 09:10 AM
I did try but for some reason it didn't get the same results as that. Anyway thanks!
alcinoe
March 5th, 2007, 09:36 AM
You need to set the margin for the body to 0. I didn't style the bottom div.

CSS


body
{margin: 0px 0px 0px 0px;
}

.top {width: 100%;
font-family:Arial, Helvetica, sans-serif;
background-color: #FCFEBB;
border-bottom:solid 1px #89B1C6;
padding:5px 0 5px 0;
text-align:center;
color:#333;
font-size:90%;
}
.bottom
{background-color: blue;}


HTML


<HTML>
<link rel="stylesheet" type="text/css" href="Style1.css" />
<div class="top">This is the top</div>
<div class="bottom">This is the bottom</div>
</HTML>
s1ntax
March 5th, 2007, 09:54 AM
body {
margin: 0px auto;
width: 100%;
}


div#see-also-bar {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
margin: 0px auto;
}
dezamp
March 5th, 2007, 12:24 PM
Yeh! it works now thanks everyone!!!:mario: