hey, I just had a quick look, its 2am so i should really get to sleep,
I tried changing the styles a bit, I been designing for year so I dont
know if this is the right way. I made the banner position:relative, so
it makes any absolute inside the div absolute from the relative
div....even though its at top so I dont know if its even needed. I
then turned off the height on the headtitle, that was probably the
problem, and took out the positioning from the top. give it a crack
anyway,
I work on a mac and works for me, just changed it a lil bit:
#banner {
padding: 0;
margin: 0;
margin-bottom: 0;
background-color: #000;
height:115px;
position:relative;
}
#headtitle {
position:absolute;
margin-left:115px;
width:160px;
left: 0;
bottom:0px;
vertical-align:bottom;
}
and as for vertical aligning altogether, I only ever found this code,
and Its only set up for vertical aligning in the middle of a browser.
so I guess you could edit it and make it for vertical aligning in
smaller divs (height), took me time to find it. and you can take out
the margin: auto; and make it 100%. and I played around with it a fair
bit. I changed this code at the for the outer to have 100%, but you
can make it pixels, and it will place it in the middle of the browser.
you could also put floats inside it and alter the heights etc to fit
in smaller containers. anyways im outa here,
adz
html,body,#outermost {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
text-align: center; /* IE/Win bug fix */font-size: 1em;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#wrapper {
margin: 10px;
}
#outer {
height: 280px;
width: 100%;
border-top: 1px solid #f93;
background-color: #585d5f;
}
/*
Works in IE5+/Win, Opera 6+, Netscape 6+, Firefox, Konqueror 3, Safari
Does not work in NS4.x or IE/Mac
*/
.valignmid1 {
position: relative;
margin: 0 auto;
}
/* Opera 7.0x is buggy when you put display:table on <body> Opera 7.2+ and 6.x
don't appear to have this problem. We hide this from IE5/Mac, because it
doesn't support display:table-cell and it doesn't have the same bug that allows
this to work in IE5-6/Win (hide from IE/Mac) \*/
.valignmid1 {
display: table;
vertical-align: middle;
}
/* Moz1.4 - Moz1.6 (NS7.1) bug, can't put position:relative on .valignmid2 \*/
.valignmid2 {
width: 100%;
display: table-cell;
vertical-align: middle;
}
* html .valignmid2 {
top: 50%;
left: 0;
position: relative;
}
* html .valignmid3 {
top: -50%;
position: relative;
}
/* This is to make the text easier to select in IE5-6/Win (hide from IE/Mac) \*/
* html .valignmid1,
* html .valignmid2,
* html .valignmid3 p,
* html .valignmid3 h1 {
height: 1%;
}
<div id="outermost" class="valignmid1">
<div id="wrapper" class="valignmid2">
<div id="outer" class="valignmid1 valignmid3">
<div class="valignmid2">
asdasd
</div>
</div>
</div>
</div>
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
