Page 1 of 1
div and classes SOLVED
Posted: Wed Oct 01, 2003 12:43 pm
by m3rajk
i need a centered division. i noticed that align is dprecated. by making a class and using text-align:center i found that the line with the text align is ignored (using mozilla 1.3.1 haven't checked othere)
anyone know why? until i can find a way to make it work with the class i'm using align. i would like to move to the class.
Posted: Wed Oct 01, 2003 2:04 pm
by cybaf
Code: Select all
pageCoords = new getPageCoords();
function centerAlign(id) {
divObj = document.getElementById(id)
if(pageCoords.width > 760) {
newLeft = Math.ceil(((pageCoords.width - parseInt(divObj.offsetWidth())) /2));
} else newLeft = 0;
divObj.style.left = newLeft;
}
function getPageCoords() {
this.width = (is.ns || is.ns6up) ? window.outerWidth:document.body.clientWidth;
this.height = (is.ns || is.ns6up) ? window.innerHeight:document.body.offsetHeight;
return this;
}
just took a bit from a
VERY large javascript that I've made. the is object
is just a browsercheck. but I didn't include the function that creates that here.
This script will allow you to center any div inside a browserwindow. as of now the above script is not really crossbrowser but if you want to have a look at my original script just say so.
Regards,
//cybaf
Posted: Wed Oct 01, 2003 2:28 pm
by Vincent Puglia
Hi
Did you try:
Code: Select all
<center><div id="Test" style="....">
</div></center>
Vinny
Posted: Wed Oct 01, 2003 4:50 pm
by Unipus
Well that would sort of defeat the whole point, wouldn't it?
Try using margin-left: auto and margin-right: auto. Or use a wrapper div.
Posted: Wed Oct 01, 2003 6:50 pm
by m3rajk
Vincent Puglia wrote:Hi
Did you try:
Code: Select all
<center><div id="Test" style="....">
</div></center>
Vinny
the class i had turned the font-face and font-color correctly. it didn't work so i made a test one ...
Code: Select all
.center{ text-align:center }
and used that in a page
Code: Select all
<html><head><title>div class test</title><style type="text/css">@import url(textStyle.css);</style></head><body>
<div class="center">testing centering</div>
</body></html>
and that didn't align
Posted: Thu Oct 02, 2003 5:54 am
by twigletmac
Try changing your CSS from:
Code: Select all
.center{ text-align:center }
to
Code: Select all
.center {
text-align: center;
margin-left: auto;
margin-right: auto;
}
as Unipus suggested.
Mac
Posted: Thu Oct 02, 2003 1:27 pm
by m3rajk
works like a charm. thanks.