I have my user menu set to a max width of 1280px and it is centered by using margin: 0 auto; which is working fine with Firefox and Chrome but not the new Edge browser, it floats to the left with Edge. How can I center the user menu with Edge?
Edge wont recognize margin: 0 auto?
-
- WBB 4.1.x
-
LogixX -
January 4, 2016 at 5:01 PM
-
Link to the forum?
-
Link to the forum?
This one https://admin-hub.com/
-
I can’t reproduce this on my edge. Everything is centered.
-
I can’t reproduce this on my edge. Everything is centered.
That's odd. Then maybe there is something wrong with the way I added my CSS?
CSS.userPanel {max-width: 1280px; margin: 0 auto; border-radius: 0 0 8px 8px;} -
I can’t see any problem with your CSS and it is not possible that the same browser renders differently on different systems.
Does the problem also occur if you aren’t logged in?
-
Does the problem also occur if you aren’t logged in?
Yes, it happens either logged in or not.
-
As you can see in my screenshot, there’s no problem.
Are you using the latest version of Edge?
-
Trying clearing all forum cache stored. Not sure if that would make any difference and is there not a chance the browser is still caching things from how it looked before still. Might be worth clearing browser out as well.
-
.userPanel {max-width: 1280px; margin: 0 auto; border-radius: 0 0 8px 8px;}
How comes you use 8px for border radius when the rest of the forum uses 6px. That means they don't match up.
@wcfContainerBorderRadius: 6px;
You could have done this instead:
.userPanel {max-width: 1280px; margin: 0 auto; border-radius: 0 0 @wcfContainerBorderRadius @wcfContainerBorderRadius;}
-
Are you using the latest version of Edge?
Turns out that everything is fine in the Edge browser, it's IE 11 that has the issue.
I didn't even know there was an IE 11
, why did they release IE 11 and Edge? -
I use IE11 on Windows 7, what is it your seeing out alignment?
I don't get what you mean by user menu?
-
I use IE11 on Windows 7, what is it your seeing out alignment?
The user menu floats to the left.
Inspect Element sucks with IE too.
-
I can't check that on my monitor because I use 1280x1024 res and the forum stretches full screen width for me.
You can also see in my screen-shot what I meant before when saying to you the rounded corners don't suit a full screen width seen, not if the forum fills the whole screen like on mine due to used a smaller screen res same or lesser than your max-width
-
You can also see in my screenshot what I meant before when saying to you the rounded corners don't suit a full screen width seen
I just need to add some margin for smaller screens.
-
You also should consider adding 10px transparent spacing in the logo itself before the image in it. As the logo sits right up flush to left side and needs a bit of transparent spacing added on left side in it. That is what I did with the logos used on my own site for full-width styles added.
-
As the logo sits right up flush to left side and needs a bit of transparent spacing added on left side of it
I imagine that if I can figure out how to add the margin it will take care of that as well. Adding margin to #main doesn't seem to do anything.
Edit: It's .layoutFluid that needs the margin.
-
I imagine that if I can figure out how to add the margin it will take care of that as well.
Yes it would, so long as nobody at all is seeing the site full-width of their display screen.
-
Hmm... you have me thinking now if it's a good idea for me to offer full-width theme option? As it gonna look a bit bad full-width in a monitor using far bigger than 1280 screen res. Not sure offering full-width is ideal the way I'm doing it with no max-width used.
You use a large monitor, what does my forum look like on your screen picking full-width style, as I know it will fill your whole screen. Will you post a screen-shot of it?
Participate now!
Don’t have an account yet? Register yourself now and be a part of our community!