MyBB Community Forums

Hello guys,

I just started using mybb, and I'm now experiencing an issue. I'd really appreciate it if someone could help me.

So basically, when you post a small reply/thread (for example one line), the post body takes a minimum space, which makes replies a bit not organized. 



I wanted to change it and make it a little bit look like vbulletin style (so that it takes at least the same as the classic profile's height). So I tried adding a padding in the bottom of the post body.

I inspected the element and tested it there and it did work.



Then, I went to Themes -> [my theme] -> global.css -> .post_body.
I added this line but it did not change anything: padding-bottom: 11em;

Hi, 

as you show in your last image, in the "Extra CSS Attributes", there is:

padding: 12px 0;
padding-bottom: 11em;

There is the problem, if you read the CSS padding "manual":

Quote:If the padding property has two values:

Example: padding: 25px 50px;
top and bottom paddings are 25px
right and left paddings are 50px

You are telling your css script to have 12 px padding-bottom (first line), and padding-bottom: 11 em (second line), and the browser chooses the first one, and that's the reason that there's no change at all.

Change the two lines in one with:

padding: 12px 0 11em;

because:

Quote:If the padding property has three values:

Example: padding: 25px 50px 75px;
top padding is 25px
right and left paddings are 50px
bottom padding is 75px

More info:
https://www.w3schools.com/css/css_padding.asp

Yeah I noticed that yesterday and I had it fixed, but nothing seems to change.
The problem that I have is inability to modify global.css file, cause I tried modifying other things (colors, font sizes..etc) and it doesn't work, it just messes with some fonts and freezes until I reset the .css file, and it keeps happening over and over.

I granted all permissions over that file (0777), but nothing changed :|

(2018-09-06, 06:06 PM)NoRules Wrote: [ -> ]Hi, 

as you show in your last image, in the "Extra CSS Attributes", there is:

padding: 12px 0;
padding-bottom: 11em;

There is the problem, if you read the CSS padding "manual":

Quote:If the padding property has two values:

Example: padding: 25px 50px;
top and bottom paddings are 25px
right and left paddings are 50px

You are telling your css script to have 12 px padding-bottom (first line), and padding-bottom: 11 em (second line), and the browser chooses the first one, and that's the reason that there's no change at all.

There should still be padding with what the OP put, either the browser will replace the 12px (top and bottom) with the 11em OR it will add to the padding. Either way there should be some result.

OP i see you're using px and em, not sure if you mean to do that, but lookup the difference between the 2 units, rather stick to px if you're unsure.

Are you pressing CTRL+F5 after making these changes? This is needed to hard refresh the page so that the CSS changes can take effect. There's no need to mess with permissions for this - go to your ACP -> click on Tools & Maintenance, and then scroll down the page. If you have all green ticks there, then your permissions are all fine.

The hard refresh worked, thanks man
and yeah, I used px instead, I replaced the whole padding line with: padding: 6px 0 167px 0;

I still have a small issue, is there any way I can have this implemented: I want the default padding to be like this:



But, when the post contents exceed that area, there's no need of this blank space:



Maybe I should edit something in HTML?

You should use flex for this:

https://www.w3schools.com/css/css3_flexbox.asp

Could you please help me with the code? I'm not really that good with CSS

I don't think he needs flex. Why don't you set a minimum height to the .post_body with css instead of padding?
The css should be something like that changing the px of min height:

padding: 6px 0;
min-height: 400px