IPB 4.0 Avatar Issue

Mitsuru

Aspirant
Joined
Feb 8, 2015
Messages
41
Hello, I decided to ask for help here. I'm soon to be an Administrator in an IPS 4.0 Forum so I'm practicing one Demo's some CSS edits I need to do. this is where I am Stuck:

A lot has changed since 3.4.X and I can't find the Show full photo in topic anymore.

First off I can't get rid of the 90x90 Avatar size, nor do I know where to increase it http://prntscr.com/7uab2j

I installed a free skin and whoever made it made the photo favor vertical pics http://prntscr.com/7uabik

but on the CSS I still don't know how to get rid of the 90x90 size and change it, nor how can I make it possible for the full image to come out in a topic.

I also would like to know how to change the size in the user profile http://prntscr.com/7uacfw


Thanks in advance to anyone who can help.
 

doubt

Tazmanian
Joined
Feb 25, 2013
Messages
4,869
Hello, I decided to ask for help here. I'm soon to be an Administrator in an IPS 4.0 Forum so I'm practicing one Demo's some CSS edits I need to do. this is where I am Stuck:
Are those screenshots from someone else's site or is it your own site with 10,003 posts?
 

steve00

IPB Skinner
Joined
May 14, 2008
Messages
375
Hello, I decided to ask for help here. I'm soon to be an Administrator in an IPS 4.0 Forum so I'm practicing one Demo's some CSS edits I need to do. this is where I am Stuck:

A lot has changed since 3.4.X and I can't find the Show full photo in topic anymore.

First off I can't get rid of the 90x90 Avatar size, nor do I know where to increase it http://prntscr.com/7uab2j

I installed a free skin and whoever made it made the photo favor vertical pics http://prntscr.com/7uabik

but on the CSS I still don't know how to get rid of the 90x90 size and change it, nor how can I make it possible for the full image to come out in a topic.

I also would like to know how to change the size in the user profile http://prntscr.com/7uacfw


Thanks in advance to anyone who can help.

Avatar size:
Code:
.ipsUserPhoto_large img, img.ipsUserPhoto_large, .ipsUserPhoto_large::after {

add width and height but take into account that the whole area is only 200px wide and is governed by:

Code:
.ipsColumn_medium {
    width: 200px;
}

and may also be used elsewhere so careful if you change that part

for the profile pic then that is governed by:

Code:
.ipsUserPhoto_xlarge img, img.ipsUserPhoto_xlarge, .ipsUserPhoto_xlarge::after {

and is by default 120px x 120px

NOTE: If using your own css then advise to add to the custom.css
 

Mitsuru

Aspirant
Joined
Feb 8, 2015
Messages
41
Avatar size:
Code:
.ipsUserPhoto_large img, img.ipsUserPhoto_large, .ipsUserPhoto_large::after {

add width and height but take into account that the whole area is only 200px wide and is governed by:

Code:
.ipsColumn_medium {
    width: 200px;
}

and may also be used elsewhere so careful if you change that part

for the profile pic then that is governed by:

Code:
.ipsUserPhoto_xlarge img, img.ipsUserPhoto_xlarge, .ipsUserPhoto_xlarge::after {

and is by default 120px x 120px

NOTE: If using your own css then advise to add to the custom.css
Thank you for the information but where exactly do I find these codes?

ACP > Themes > Skin > Edit Html and CSS > CSS tab > ?? There are many css files

And where do I put the Width and height on

.ipsUserPhoto_large img, img.ipsUserPhoto_large, .ipsUserPhoto_large::after {

Sorry I'm very new to this in 3.4.X it was a ton easier
 
Last edited by a moderator:

steve00

IPB Skinner
Joined
May 14, 2008
Messages
375
As I stated in the custom.css (which should be the one more prominent than any other)

css1.jpg

If do not know how to add width and height into css then you are going to have problems:

Code:
.ipsUserPhoto_large img, img.ipsUserPhoto_large, .ipsUserPhoto_large::after {
width: whatever width you want;
height: whatever height you want;
}
 

Mitsuru

Aspirant
Joined
Feb 8, 2015
Messages
41
As I stated in the custom.css (which should be the one more prominent than any other)

View attachment 35920

If do not know how to add width and height into css then you are going to have problems:

Code:
.ipsUserPhoto_large img, img.ipsUserPhoto_large, .ipsUserPhoto_large::after {
width: whatever width you want;
height: whatever height you want;
}
It worked!! Thank you very much. I made it 180 x 180 and looks great.

Thanks Again :D
 

Tracy Perry

Opinionated asshat
Joined
May 25, 2013
Messages
5,039
is there a new way to do this or something?
More than likely you will have to address several areas of the system with CSS edits. Not just the avatar image, but the
Code:
html[dir="ltr"] .cPost .ipsComment_content
area also.
 
Top