anyone else noticed the menu is not central on pro?
I have a few test sites on the go, each with different number of menu items showing.
logo/site title is central, but menu is always off to the left of centre.
almost looks like its trying to show an additional menu link to the right of menu but nothing there so whole thing is off balance.
anyone else got this???
|
Image attached with logo not central.
Looks like the logo / name is placed centre between the search bar and profile link.
search bar is wider than top link though so logo is not central to the page...
can someone else confirm this
its the same on both my 7.2 test sites...
|
Logo is positioned exactly between search input and account menu. Since search input can be wider than account menu or vice versa then logo could be not exactly in the centre of the page. But current positioning is especially designed to fit maximum in the case of wider logo or longer name, especially for small mobile screens. Rules → http://www.boonex.com/terms |
problem is the middle positioning of logo is based on the end of the search bar, whereas it should be based on the beginning of it. This way it would be central to the screen... |
FIX
fix is applied by adjusting the profile system menu box
evo/.../general.css - line 71
sys_menu_wrapper
add
min-width: 205px;
base/.../general.css - line 255
div.sys-service-menu
add
float: left;
this sets profile menu to same width as search box menu, and floats to right so page asthetics are maintained.
not sure why this is not included in standard, default code means the main site logo will not be fixed in centre as will change for each user according to width of their user name!
fixed image attached.
|
ignore second part
base/.../general.css - line 255
div.sys-service-menu
add
float: left;
creates other text alignment issues.
looking for fix...
|
evo/.../general.css
line 112
comment out display: inline-block;
this will change width of profile box to same as search box, but display with correct position and width
|
The only issue with this, is if the user has a short member name the box has a lot of open space in it. Just following your first step has seemed to fix the issue regardless of username length. |
This is what I'd do, if it bugs you that the logo isn't centered. Append to general.css Extra long user names over about 17 characters will be truncated with ellipsis.
td.sys_menu_wrapper {
width:25%;
}
td.sys_search_wrapper {
width:25%;
}
td.sys_logo_wrapper {
width:unset;
}
div.sys_ml_wrapper table tr {
width:100%;
}
div.sys_ml_wrapper table {
width:100%;
}
td.sys_search_wrapper .sys-service-menu {
float:left;
}
td.sys_menu_wrapper .sys-service-menu {
float:right;
}
span.sys-smp-title {
max-width:150px;
overflow:hidden;
text-overflow:ellipsis;
}
Then, if you do all that, you'll need to change the mobile css also, to remove the 25% widths. A big pain in the ass if you ask me, for such a small detail. Personally, I think it looks better the way it is originally.
My opinions expressed on this site, in no way represent those of Boonex or Boonex employees. |