Win a copy of Functional Reactive Programming this week in the Other Languages forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

center a div inside a div

 
Bryce Martin
Ranch Hand
Posts: 269
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'm trying to center a div inside a div. I have a containing div. Inside that div I have another div that has a table inside of it. The div and the table are fixed widths. The containing div is width 100% and is inside of a div that wraps the whole page. I'm having trouble getting my table div to center inside the containing div. Strangely enough I can get it to work inside of IE6 but not FF2.

I've tried the text-align: center. Which works for IE6. I tried the margin-right: auto; margin-left:auto; for FF2 but that doesn't work. It should. But it doesn't. I'm at a loss. Anybody have any ideas? I'm thinking of just using jqGrid and forgetting this whole stupid thing. But I won't know if that works until I do it...E I E I O.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65228
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Without code, it's hard to guess. The auto margin trick usually works for me.
 
Bryce Martin
Ranch Hand
Posts: 269
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'm working on a jqGrid right now. If I'm still having problems after this I'll report back...

I thought for sure that the margin align would work too...heck I was on a page that used it for an example, and since I was using firefox it was supposed to work, and it did. But my own code wouldn't do it. Do you think I should specify a DTD?
 
Gregg Bolinger
Ranch Hand
Posts: 15304
6
Chrome IntelliJ IDE Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Originally posted by Bryce Martin:
Do you think I should specify a DTD?


Sure. And while your at it throw in some arbitrary tags like <font /> and <embed />. I mean, as long as we're just guessing since we don't have example code to debug.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 65228
95
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
To Gregg's point, yeah, it's hard to help you debug this without any code.

With regard to adding a DOCTYPE, you might want to look up the concept of quirks mode on quirksmode.org. That often accounts for differences between IE and real browsers.

Unless I have a good reason otherwise, I try to keep all my pages in standards mode. This tends to make for more deterministic behavior.
 
Bryce Martin
Ranch Hand
Posts: 269
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Ok. I'll post the code for the page and then I'll post the external style sheet after that. Here are the issues that I'm seeing. In IE the tables will center if I use that nice little text-align: center; for the div. But I can't get the table header to stop from scrolling with the body. In FF2 the table works great and the header doesn't move, however, I can't get the div that contains the table to center. It should with the margin-left: auto; and margin-right: auto; but its not working. I'm at a loss.

So heres what you asked for...



JSP





CSS

 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic