Yes I checked on Mac chrome and the link you gave above rendered ok. You will need to give me a link to the broken page if you want this fixed properly.
1 Like
Paul,
Actually I made changes to the page so now it displays OK under Apple Chrome too, when you are not logged into your (Anoox) account. That is why when you checked it, it rendered ok. So then this narrows the problem to the CSS/HTML Code of the members Top Navigational bar, which is very good news since this is a very small part of the page. And I confirmed this by removing it and then even when logged into your account, this page loads OK under Apple Chrome too. Yey 
So then I looked and looked at the CSS of this members Navigational bar and see nothing wrong with it that could be causing this problem with Apple Chrome. I am including the members Nav Bar CSS/HTML below, so hopefully you can suggest the change make to it to take care off this darn problem with Apple Chrome loading of this page OK:
<style>
#menu_top_con {
position: relative;
background: #B7B8B6;
margin: 0px;
margin-top: 1px;
margin-bottom: 1px;
height: 30px;
}
#menu_top_hold {
float: right;
margin-right: 20px;
}
.menu_top_butns {
display: inline-block;
padding: 5px;
padding-left: 10px;
border-left: 1px solid #4CB5F5;
border-right: 1px solid #4CB5F5;
color: white;
cursor: pointer;
background: #68829E;
font-size: 1rem;
margin: 0px;
position: relative;
}
.menu_top_butns:hover {
background: #505160
}
.point_down_arrow, .point_arrow_home {
display: inline-block;
margin-left: 2px;
transform: rotate(90deg);
font-size: 0.7rem;
}
.point_arrow_home {
transform: rotate(0deg);
font-size: 0.9rem;
}
.drop_down_pop {
position: absolute;
font-size: 0.85rem;
z-index: 1000;
padding: 5px;
BORDER: 1px solid #87ceeb;
BACKGROUND-COLOR: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
display: none;
width: 200px;
right: 0;
top: 100%;
}
.menu_top_item {
margin: 2px;
padding: 5px;
border: 1px solid #45b3e0;
color: #45b3e0;
cursor: pointer;
}
.menu_top_item:hover {
background: #45b3e0;
color: white;
}
#menu_top_anon {
position: absolute;
font-size: 0.7rem;
color: white;
left: 10px;
top: 10px;
}
</style>
<div id="menu_top_con">
<div id="menu_top_anon">
** Version Release Info **
</div>
<div id="menu_top_hold">
<div class="menu_top_butns" onclick="jump_to_url('/my/home.php');">
Home
<div class="point_arrow_home">
⟰
</div>
</div>
<div class="menu_top_butns" OnMouseOver="top_menu_ctl('mys_drop_down', 'open');" OnMouseOut="top_menu_ctl('mys_drop_down', 'close');">
My Search Inputs
<div class="point_down_arrow">
➤
</div>
<div class="drop_down_pop" id="mys_drop_down">
<div class="menu_top_item" onclick="jump_to_url('/search.php');">
Search & Share
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/find_my_comms.php');">
Sites i Reviewed
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/find_my_votes.php');">
Sites i Liked
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/find_my_reports.php');">
Sites i Reported
</div>
</div>
</div>
<div class="menu_top_butns" OnMouseOver="top_menu_ctl('polls_drop_down', 'open');" OnMouseOut="top_menu_ctl('polls_drop_down', 'close');">
My Polls
<div class="point_down_arrow">
➤
</div>
<div class="drop_down_pop" id="polls_drop_down">
<div class="menu_top_item" onclick="jump_to_url('/polls/my_polls.php');">
My Current Polls
</div>
<div class="menu_top_item" onclick="jump_to_url('/polls/create_poll.php');">
Create New Poll
</div>
</div>
</div>
<div class="menu_top_butns" OnMouseOver="top_menu_ctl('sites_drop_down', 'open');" OnMouseOut="top_menu_ctl('sites_drop_down', 'close');">
My Sites
<div class="point_down_arrow">
➤
</div>
<div class="drop_down_pop" id="sites_drop_down">
<div class="menu_top_item" onclick="jump_to_url('/add_for_indexing_manage.php');">
Manage My Sites
</div>
<div class="menu_top_item" onclick="jump_to_url('/add_for_indexing_free.php');">
Submit New Site
</div>
</div>
</div>
<div class="menu_top_butns" OnMouseOver="top_menu_ctl('frnd_drop_down', 'open');" OnMouseOut="top_menu_ctl('frnd_drop_down', 'close');">
My Friends
<div class="point_down_arrow">
➤
</div>
<div class="drop_down_pop" id="frnd_drop_down">
<div class="menu_top_item" onclick="jump_to_url('/news/invite_fr_current.php');">
My Current Friends
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/invite_fr.php');">
Make New Friends
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/invite_fr_pending.php');">
Pending
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/invite_find.php');">
Find Member by Name
</div>
</div>
</div>
<div class="menu_top_butns" OnMouseOver="top_menu_ctl('msgs_drop_down', 'open');" OnMouseOut="top_menu_ctl('msgs_drop_down', 'close');">
My Msgs
<div class="point_down_arrow">
➤
</div>
<div class="drop_down_pop" id="msgs_drop_down">
<div class="menu_top_item" onclick="jump_to_url('/news/msgs_inbox.php');">
My Inbox
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/msgs_sentbox.php');">
My Sent Box
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/msg_new.php');">
Write New Message
</div>
</div>
</div>
<div class="menu_top_butns" OnMouseOver="top_menu_ctl('butn_drop_down', 'open');" OnMouseOut="top_menu_ctl('butn_drop_down', 'close');">
My Button
<div class="point_down_arrow">
➤
</div>
<div class="drop_down_pop" id="butn_drop_down">
<div class="menu_top_item" onclick="jump_to_url('/news/acb_explore.php');">
Overview
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/acb_anoox_button.php');">
Create My Button
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/my_credits.php');">
My Credit Hirstory
</div>
</div>
</div>
<div class="menu_top_butns" OnMouseOver="top_menu_ctl('myac_drop_down', 'open');" OnMouseOut="top_menu_ctl('myac_drop_down', 'close');">
My Account
<div class="point_down_arrow">
➤
</div>
<div class="drop_down_pop" id="myac_drop_down">
<div class="menu_top_item" onclick="jump_to_url('/news/sign_up.php?edit=true');">
Update My Account
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/profile_update.php?edit=true');">
My Profile
</div>
<div class="menu_top_item" onclick="jump_to_url('/ask_answer/profile_thumb_nail.php');">
My Thumbnail
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/email_notify_pref.php');">
My email Preferences
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/password_mgr.php');">
Update Password
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/change_email.php');">
Update email
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/support_contact.php');">
Support
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/block_mem.php');">
Block Member
</div>
<div class="menu_top_item" onclick="jump_to_url('/news/cancel_account.php');">
Cancel Account
</div>
</div>
</div>
<div class="menu_top_butns" onclick="jump_to_url('/news/login_news.php?log_out=true');">
Log Out
</div>
</div> <!-- closes menu_top_hold -->
</div> <!-- closes menu_top_con -->
I dont know why it is, but somehow Siteopont display is not showing the parent DIV to all these DIVs which is:
id="menu_top_con
⌠everything above goes inn between here
and then closing DIV here, but again if I try to just copy paste this DIV here Sitepoint will
not show it.Anyway, so all of the above HTML is wrapped into this parentDIV
Hi,
Could you post a stand alone demo that holds that members page code, and confirm that the demo display erroneously in your Apple Chrome?
(That is actually what youâre asking each one of us to do in order to test if the posted code contains the error. Thatâs more convenient and sometimes faster than analyze it by just reading.)
It is a strange argument that because there are errors on other websites, that means you shouldnât fix the errors in your site, especially, as Erik has pointed out, one of those is a fatal error.
How many dozens of browsers and devices have you actually tried? Does it work in Inbrowser? Opera Mini? Lynx? Dillo? Elinks?
Erik,
Ok, here is a link that will Auto log you in as a Member. So that you can see how the page is broken for Members only under Apple Chrome only:
https://www.anoox.com/my/share.php?i=137012&ans=63883&tc=62342103&ntq=3332812
note: this link will expire in few days
So as noted before since this page now loads OK now under Apple Chrome for person not logged in as a member, but not Ok for person logged in as a member, then obviously the problem is with members Navigational bar, since on HTML side that is only thing different between the two.
Really hoping you will have a solution, since we are ready to go live with this Major New release today
Thanks.
That code seems to render more or less OK on the apple mac in Chrome.
There are some basic css issues such as the floated elements are not contained in the parent and a browser may snag on some of the elements if they poke downwards. Your main parent here has a height defined (always a bad move) but in Chrome the height is taller than 30px for the inner items because they are content height and that will depend on a number of varying factors (not least on font-size).
You should remove the height and add a float containing mechanism instead.
#menu_top_con {
position: relative;
background: #B7B8B6;
margin: 0px;
margin-top: 1px;
margin-bottom: 1px;
/*height: 30px;*/
display:table;
width:100%;
}
Whether that has any impact on the problem is anybodyâs guess as we donât have access to the live site.
Therefore I then joined up to your site so I could debug the real problem but once signed in the display is not the same as your screenshot above and seems to be an older version (version 10.2 ) that is rendering ok on mac chrome.
You really are making this hard for me to debug what would probably be a simple set of issues.
Edit:
Just seen the link you posted above. You must have posted while I was thinking
(Lastly In your screenshot in post#4 the mac display looks as though it has been zoomed smaller from the browser. Can you confirm it is 100% zoom?)
I must be a genius
The code I gave you above fixed your problem.
#menu_top_con {
display:table;
width:100%;
}
The floats were snagging as I guessed.
3 Likes
Yes, that does Fix the problem
You are a genius
I need to read up on this display:table;
And interesting that you totally removed height. Need to look into that too.
Thanks again
We can now go ahead and put Live this Major new release.
Fingers crossed that whole thing wont blow up 
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.