text not centering in FF - CSS forum at WebmasterWorld - WebmasterWorld

Forum Moderators: not2easy

Message Too Old, No Replies

text not centering in FF

Kysmiley

9:49 pm on Dec 22, 2004 (gmt 0)

10+ Year Member

I have a PHP even calendar script I am setting up for a site and it looks great in IE but when it comes to FF the text does not center like it is suppose to. The text is in a table. I am not sure if this makes a difference to FF with IE it reads the CSS file and lines up the text as would be expected yet FF will Not. I also have a logo that lines up fine in IE and the main part of the calendar script yet soon as I move to the admin part in FF the logo is off to the side and not overlaying the background as my positioning tells it to. It there anything I need to do to get the CSS to work the same in FF as IE Here is part of the CSS codeing
##########################
CSS
/*Bottom cell/div properties */
#bottom {
width: 100%; height: 97px; margin-bottom: 5px;
background: url(http://www.mydomain.com/calendar1/images/tge-btm.jpg);
background-repeat: no-repeat; margin: 0%;
}
/* right/left main container */
#main
{
float: left; width: 98%; background-color: white; margin-left: 5px;
}

/*Left container */

#left
{
float: left; width: 17.25%; height: 310px; text-align: center; background: url(http://www.mydomain.com/calendar1/images/tge-sb.jpg); background-repeat: no-repeat; margin: 0%;
}

/*Main content pain (right)*/
#content
{
font-family: "sans serif", Arial; font-size: 16px; font-style: italic; font-size: 16px;
}
#content1 // calendar content
{
font-family: "sans serif", Arial; font-size: 16px; font-style: italic; font-size: 16px; text-align: center;
}
######################################
HTML link and last part of header include......
<link rel="stylesheet" type="text/css" href="http://www.mydomain.com/calendar1/css/tge.css">
</head><body >
<div id="content1">
Footer
</div>
<div id="bottom">
<a href="http://www.mydomain.com"><img src="http://www.mydomain.com/calendar1/images/pndlogo2-xsm.gif" class="pdlogo"></a>
</div>
</div>
</body>
</html>
I had to use the full url to compansate for the different layers of folders to read from one main one
I hope someone can offer suggestions with the little bit of coding i included
Pat

4css

10:47 pm on Dec 22, 2004 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Hi Kysmiley
Try in your style sheet,
html, body { text-align: center;}

Then in your content try {text-align: left;) (or if you wish centered then use center)

Hope that this helps you out.

Kysmiley

11:19 pm on Dec 22, 2004 (gmt 0)

10+ Year Member

thanks 4CSS but would that not mess up the rest of the sections due to inherance. It still does not help explain the logo on the bottom though. This sit liikes fine in FF on the main page but this calendar uses tables so it seems some parts of the table are reading some parts of teh CSS others are not. It is strange to me. I have not had this troulbe b4 with setup and lineups

4css

2:41 am on Dec 23, 2004 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

No, it should not mess up anything, try it and you'll see.

Kysmiley

3:00 am on Dec 23, 2004 (gmt 0)

10+ Year Member

Tried it and it placed my top left logo in the center. I even did it in the nmain div and no luck there either
it5 happens in FF and netscape

4css

11:29 am on Dec 23, 2004 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

I'm surprised as it has worked for me. Maybe you might have to add this to the styles area where you are having the problem, if you have not done so?

Have you run this through validation for css and xhtml/html? As well as made sure you have the proper dtd?

I know its slow right now with the holidays upcoming, but hopefully someone will be along that knows more to help you out. I"m learning as well, and try to give a shot at what I know has worked for me, but, lol, that doesn't mean that I have it right. ;)

Kysmiley

1:19 pm on Dec 23, 2004 (gmt 0)

10+ Year Member

Yea I was thinking the same thing also about running it thru nthe validation to see what error come up. I have gone thru all the script of most of it and placed <center> tags in front of the <table> tags for all effected erreas, this seems to have taken care of the text part even thougn it was the link way to do things. But it does not help the logo on the bottom for its posistion. on most pages it is fine and in the right place on a few it is off to the right and not even on the background as it is suppose to be. and this is in an include () file the CSS file is being called and also the footer file it is just not placing one on top of the other
real strange
Pat

4css

4:09 pm on Dec 23, 2004 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

have you tried a wrapper div? Putting the rest of the divs within this except for your footer div. The last div in the wrapper, create a clearing div. (div#clear clear:both;} Maybe if you contain your floats in a wrapper div (If you did, I didn't notice, and I apologize for not seeing it) with the clearing div as your last one in the wrapper, things might fall togehter?

Kysmiley

4:25 pm on Dec 23, 2004 (gmt 0)

10+ Year Member

Thanks for all the help 4CSS i was missing one part of what you were trying to tell me. i was not reseting the other divs back to the left align so all divs were aligning in the center even though i did not want them to.
Now that that is fixed maybe I can find out why my logo positioned on top of the footer include is ok on most pages yet on others the footer does not follow the flow and come under the left and content divs, which causes my footer background to be pushed over to the right instead of on the bottom
Pat

Kysmiley

8:08 pm on Dec 23, 2004 (gmt 0)

10+ Year Member

Thanks 4CSS placing the bottom div outside the main one took care of the logo line up problem. look for my new post as I now have a different problem that has to do with positioning. and the troubles it is giving me with this
Pat

4css

9:50 pm on Dec 24, 2004 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Hey Pat! happy to hear that this worked for you! wahoo! so happy for you! :)