Jump to content

Centering without <center>


ZeroShade

Recommended Posts

My site is set up with a master page and then it uses a content pane. When I use a center tag or css to center... everything in the content pane is centered as well which makes it very hard to work with. Using javascript... can I simply make sure that no matter what size the window is the same space between the left border and the right border is the same so that it is centered? Right now for design purpose it looks centered on our windows by setting the margin-left.

Link to comment
Share on other sites

You shouldn't have to use javascript to center that content. You could use CSS instead:

<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><body><div style="width: 50%; margin: 0px auto; border: 1px solid red;">The div itself is centered in the window, but this content inside the div is still left justified.</div></body></html>

Link to comment
Share on other sites

Doing that doesn't seem to work probably because I'm using a master page because everything else stays in the same position. This includes images, labels, etc. Thats why I figured javascript might be able to say "hey... all of you are going in the center of this screen whether you want to or not."

Link to comment
Share on other sites

Could you not make a container div that holds all the sections you want centered? Then you can center that in CSS.
I'm working with a masterpage and then every other page from there... if i were to do that... there would be a good couple hundred divs and a smashing head-ache.
Link to comment
Share on other sites

QUOTECould you not make a container div that holds all the sections you want centered? Then you can center that in CSS.I'm working with a masterpage and then every other page from there... if i were to do that... there would be a good couple hundred divs and a smashing head-ache.
I gave it more thought and your absolutely right. Thanks!!
Link to comment
Share on other sites

Tried it and just ruined everything. I don't think I can use CSS in this case.Basically with the javascript I would like to get the size of the window and store it in a variable. Then figure out how to set the left side of the body at the position. Does anybody know how to write this out in code?

Link to comment
Share on other sites

Well, since CSS isn't working for you, you might look into the Window and Screen objects of the HTML DOM:http://www.w3schools.com/htmldom/dom_obj_window.asphttp://www.w3schools.com/htmldom/dom_obj_screen.aspThen, once you look over those references, check out this page:http://www.quirksmode.org/viewport/compatibility.html

Link to comment
Share on other sites

Usually what i've seen done(or what i do) is something like this:

<!Doctype whatever goes here><html><head><title>Page Title</title><style type="text/css">body{text-align:center;}#container{text-align:left;width:400px;height:250px;border:1px solid black;/*Comment that last line out,it's used just to double check and make sure everything works*/}</style></head><body><div id="container"><p>Hello there! Apparently HTML 5 is going to be really really annoying and not allow you to put straight text into a div. You are thusly going to be required to put all items in a P tag just to simply annoy all of the people who are trying to learn web development</p></div></body></html>

that works for me in both FF and IE, looking at http://thunderfalcon.com/editables.php as a reference to prove my point. If you want, take at look at my source and grab that code if you need to. Oh and the editables thing is a MooTools script i developed(or is it developing as its buggy in IE?) so ignore that unless you wanna play around with it.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...