Center a grid on a dialog

[Steve Workings]

Simply can't find a way to do this:

I have two controls on a Dialog2 -- an image and a grid.

The image is 768px wide -- the width of my page design.

I'd like to center the grid in the dialog / under the image, but cannot figure out how.

Even putting a container around the grid didn't seem to produce the correct opportunity.

[Steve Workings]

Re: Center a grid on a dialog

As usual, post a question, and 5 minutes later figure it out. I set the container float: none;

[Steve Workings]

Re: Center a grid on a dialog

Talking to myself, this is probably not good:

Nope, I was wrong. Using either the Dialog2 or the Pagebuilder, can't figure out how to lay in an image that's centered in the component, with a grid below that is also centered in the component. I simply cannot find the right combination of containers, CSS or brute-force style instructions.

[Steve Workings]

Re: Center a grid on a dialog

Still at this a day later.

When I put a dialog component onto an A5W page, I simply cannot get it centered. I've tried all sorts of centering with DIVs, SPANs, even TABLEs. Nada.

I'm concluding, and Firefox shows me, that this CSS is the cause:

.A5container {
    float: left;
    padding: 0;
}

I cannot figure out how to override this or otherwise reassign it to float:none which is what I need.

So, who here knows how to horizontally center dialog component on a page?

[MarionT]

Re: Center a grid on a dialog

have you played with any of the POSITION.Mode settings?

[Steve Workings]

Re: Center a grid on a dialog

While I'm on the subject, I already know my next question. Graphics and CSS are just not my strongpoint and after a couple days of this I'm asking.

Using the Dialog, I'm lining up three images to comprise a menubar like this:

Snap1.jpg

But when I remove the float:left to center the dialog on the page, the three images fall apart like this:

Snap2.jpg

I've tried all combinations of containers, floats and no floats, etc.

BTW, I need the images as the three pieces because I'm going to be dynamically replacing them (got that done!). And, I'd like them to dynamically size to the width of the page as well, but again, I haven't found a way to do that. I'm beginning to think I should have just coded a lot of this into the .a5W page but for various reasons I'd much prefer to be using the Dialog.

[Steve Workings]

Re: Center a grid on a dialog

have you played with any of the POSITION.Mode settings?

Marion -- what and where are POSITION.Mode settings?

[MarionT]

Re: Center a grid on a dialog

eg
ContainerProperties
ContainerStyle - takes me to the StyleEditor

within the StyleEditor is Position and Layout
both of which seem interesting for what you are talking about

Position has Mode, with a bunch of options that don't mean anything to me.

bear in mind - I have no clue if it will help you.... I've just been empathetically playing with your problem (and avoiding my housework)....

[chadbrown]

Re: Center a grid on a dialog

Steve can you put both items in a freeform layout? Just a thought.

[Steve Workings]

Re: Center a grid on a dialog

I've decided to code the top three images - the grey bar - as regular html. Just about have that right now.

So I'm down to one thing:

Displaying a dialog component on an .A5W page, horizontally centered. I don't want to use tables, but I've tried everything else, and even this leaves the dialog left-aligned:

<table width="100%" align="center" style="margin-top:100px;">
	<tr><td align="center">
		<%a5 ?x_MENU_MAIN.Output.Body.Dialog2_HTML %>
	</td></tr>
</table>

I want to get onto database development, and here I am stuck for two days flailing the CSS.

In Firebug, I can disable the float here and get what I want:

.A5container {
    float: left;

But I cannot find any way to override or defeat this. I am sure this is own lack of skills, but somewhere along the line persistence usually pays off.

[Steve Workings]

Re: Center a grid on a dialog

Back to this again. Anyone have an answer? I spent tonight trying to center a Container in a Dialog -- it's really just a version of the other questions in this thread. How can I center a container in a dialog?

[peteconway]

Re: Center a grid on a dialog

I don't think you cant do it Steve without requesting it - the containers ignore the settings as it is. Considering containers are just div's you may want to follow up on that angle.

[2ninerniner2]

Re: Center a grid on a dialog

.A5container {
    float: left !important;

Just a thought, but perhaps adding the !important rule to this entry. It will override the inheritance.