By Josh Lewis on Sunday, 15 June 2014
Posted in Technical Issues
Replies 13
Likes 0
Views 866
Votes 0
I know this must sound like a really silly question, but for some reason I been struggling with getting the text portion of my profile link to go to the user's profile. I'm using custom code to display my avatar image and user text. The issue is occurring on this part of the site:



The avatar links fine, part of the username might link in some cases. For example the stacked account's link works for the first few characters when you hover over the text, but doesn't display at all for "Josh". To test this swap out the text to "Josh" in Firebug. The issue is still problematic with the stacked username too.

The PHP/HTML code used to display the username/avatar can be found at:
http://www.test.alpineascent.com/administrator/index.php?option=com_modules&view=module&layout=edit&id=135

I've checked multiple sources online and could not get the text link to work. When I take it out of a span tag it suddenly works perfectly, but then I can't make the text vertically aligned (center).
The only reason that the link is not working is because you are using absolute position to actually position items and it's really bad because your user menu is covering the username. You should use firebug to inspect the element.

This has nothing to do with the php codes.
·
Sunday, 15 June 2014 18:10
·
0 Likes
·
0 Votes
·
0 Comments
·
you might wanna post the coded used here, people can't log in as admin in your site
·
Sunday, 15 June 2014 13:25
·
0 Likes
·
0 Votes
·
0 Comments
·
I knew it had nothing to do with the php codes. The only reason I gave a link to the code module was just in case you knew of a quick fix. I knew that there was a good chance that it might not be a quick fix.

Your absolutely right about the absolute position messing with the link in terms of what part works. I had no idea the position property would effect links in such a strange fashion. Aside from it messing with the link, I don't see how it's really bad. I tested four variations of names (two on different sized screens). Here is what it looks like for really long names:



Here is what it looks like for short names:



From what I've seen it's displaying as it should. So your telling me that some how the user menu was over lapping? Or was this on a cell phone. I admit that my template needs some work to make it responsive which I'll get to some day (some parts are as of now). I am using a absolute position so that my objects could be placed to the right. This site (the stack ideas one that is) uses list items and a single float right to pull it off. Would you recommend using that method instead?
·
Wednesday, 18 June 2014 02:25
·
0 Likes
·
0 Votes
·
0 Comments
·
After taking your hint and doing a search I found a solution on Stackoverflow. However before calling it good enough, I'm very curious about the over lapping issue you mentioned. So for sure you saw over lapping on my test site?
·
Wednesday, 18 June 2014 03:10
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Josh,

Yep, that's right the menu UL is actually overlapping on the "name". Hence, with a shorter name it works
·
Thursday, 19 June 2014 00:50
·
0 Likes
·
0 Votes
·
0 Comments
·
I can't seem to produce that issue even with different screen sizes and a different browser even when the name is really long. I'm curious how you produced that issue.
·
Thursday, 19 June 2014 01:22
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Josh,

I think the screen shot here would give you a better idea of what I am referring to http://screencast.com/t/iYX2JAdL5iS
·
Thursday, 19 June 2014 10:41
·
0 Likes
·
0 Votes
·
0 Comments
·
Thanks for the screen shot. That setup is actually intentional. I might have to make a few pixel adjustments with the padding, but it's mostly what I am aiming for. The user profile link is supposed to be right next to the menu so that user interactions are all in one centralized location.
·
Thursday, 19 June 2014 12:13
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Josh,

But the way it's done causes the element to overlay over the name which then prevents the "clicking" on the name.
·
Thursday, 19 June 2014 13:07
·
0 Likes
·
0 Votes
·
0 Comments
·
That was true when I started this discussion. However I set the z-index very high for the avatars module position. Now the entire link is clickable even on very long names. I suppose maybe you are going off of the initial test you made or your browser has the old css file cached.

BTW, good to hear your feeling better.
·
Thursday, 19 June 2014 15:16
·
0 Likes
·
0 Votes
·
0 Comments
·
Hello Josh,

Sorry I think I missed this thread earlier. Are you still having issues with it?
·
Wednesday, 25 June 2014 15:52
·
0 Likes
·
0 Votes
·
0 Comments
·
Not that I've noticed. I'm heading out to Peru for a long time tomorrow morning. I should be back during early August. My delayed response is due to extremely limited internet access during this past week on my beginning part of the trip.
·
Sunday, 29 June 2014 11:52
·
0 Likes
·
0 Votes
·
0 Comments
·
Ah, I see. Thanks for the heads up on this
·
Sunday, 29 June 2014 17:32
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post