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&#123; text-align:center &#125;
and used that in a page

Code: Select all

&lt;html&gt;&lt;head&gt;&lt;title&gt;div class test&lt;/title&gt;&lt;style type="text/css"&gt;@import url(textStyle.css);&lt;/style&gt;&lt;/head&gt;&lt;body&gt;
&lt;div class="center"&gt;testing centering&lt;/div&gt;
&lt;/body&gt;&lt;/html&gt;
and that didn't align

Posted: Thu Oct 02, 2003 5:54 am
by twigletmac
Try changing your CSS from:

Code: Select all

.center&#123; text-align:center &#125;
to

Code: Select all

.center &#123;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
&#125;
as Unipus suggested.

Mac

Posted: Thu Oct 02, 2003 1:27 pm
by m3rajk
works like a charm. thanks.