Avatar is not center aligned in border

[pauldyke]

Hi
Thanks for the template – just setting this up for a church website! I’m having trouble with the display of the mini avatars – in widgets and on the activity stream. They appear left aligned. I have tried changing to square and the problem is there too. The miss-alignment is different for the activity stream to the widgets.

Many thanks,
Paul

[adam]

does your css look like this?

COPY CODE

.activity-list span.avatar, #whats-new-avatar, #activity-stream div.avatar {
height: 60px;
width: 60px;
left: -30px;
margin-bottom: 20px;
}

if not, give it a shot in quick css. that should work for activity at least. not sure which widgets you mean?

[pauldyke]

Thanks Adam – yes Chrome’s inspect element says this is the css I’m using. It’s the Members and Groups sidebar widgets that I’m referring to.

[pauldyke]

Taking a look at the CSS has helped – thank you.

I’ve reduced the following pixels from 60px to 54px and the border is now circular! Not sure why it became oblong. I’ve added the following to Quick css:

.buddypress.widgets ul.item-list .item-avatar {width: 54px}
.activity-list span.avatar, #whats-new-avatar, #activity-stream div.avatar {width:54px; height:54px}

[SQadmin]

Hi Paul, the above code is ok, I think other is the problem, you have a link to look closer?

Regards,
Robert

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[pauldyke]

This reply has been set as private.

[SQadmin]

Hi Paul, I tested in multiple browsers on mac and windows and all avatars seem to be ok. What browser are you using?

ps: I also attached some screenshots with these http://d.pr/i/XmhC , http://d.pr/i/McQi

Regards,
Robert

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[pauldyke]

Hi Robert

Yes, all seems fine now I’ve added the CSS adjustments. I’m testing in Chrome and IE.
Happy to set this as fixed.

Many thanks
Paul

[Author]

Posts