[TrultToast]

Howdy!

I seem to have a problem where a few boxes don't exactly line up right even though they are both at 100%.

Here is an example of the problem:


The blue box on top doesn't line up with the rest of the threadlist and the threadlisthead seems to be missing the bottom right hand corner of the border... I honestly have no idea how to fix this.

[MarkFL]

If you can post a link to your site, I might can tell you what CSS to add to remedy the issue.

[TrultToast]

Originally Posted by MarkFL

If you can post a link to your site, I might can tell you what CSS to add to remedy the issue.

Sorry for the late reply... I was having computer issues.
Here you go: https://boards.rottensquash.com/

I've also noticed the issue on my forum homepage in the box that shows the stats.
Also don't mind all the spam posts, I was just testing something, haha.

[MarkFL]

Try adding this to your "additional.css" template:

Block Disabled:      (Update License Status)
Suspended or Unlicensed Members Cannot View Code.

[webmastersun]

Originally Posted by MarkFL

Try adding this to your "additional.css" template:

Block Disabled:      (Update License Status)
Suspended or Unlicensed Members Cannot View Code.

what do these codes mean?

[MarkFL]

Originally Posted by webmastersun

what do these codes mean?

The issue seemed to be that the custom style used by the OP is a mix of table and div elements. I found that by making the borders of the div elements display on the inside rather than on the outside as they do by default, then the elements appear to be the same size.

[TrultToast]

Originally Posted by MarkFL

The issue seemed to be that the custom style used by the OP is a mix of table and div elements. I found that by making the borders of the div elements display on the inside rather than on the outside as they do by default, then the elements appear to be the same size.

Thanks for explaining. I was about to ask that question too, lol.
Any chance you could help me fix my forumhome template too? Sorry to be a bother... I tried using the code you supplied above in a few spots but I had no luck in fixing the borders in my statistics box.

[Seven Skins]

You are inserting a table in OL tags .. hence they don't line up.
This may work.. warp the table in LI tags and use the same class as other LI tags on the forumhome page.

[TrultToast]

Originally Posted by Seven Skins

You are inserting a table in OL tags .. hence they don't line up.
This may work.. warp the table in LI tags and use the same class as other LI tags on the forumhome page.

Just tired this... no luck

[Seven Skins]

I don't see that on your site.



You cannot insert table in ol or ul lists... as mentioned earlier warp the table in li tag or move the table out of ol tags.

[TrultToast]

Originally Posted by Seven Skins

I don't see that on your site.



You cannot insert table in ol or ul lists... as mentioned earlier warp the table in li tag or move the table out of ol tags.

Just moved the table out of the ol tags and placed it above them.
The problem still exists.

Apparently this problem also exists with the "nonthread" class on the forumdisplay template when there are no posts in the forum.
Ugh..

[TheLastSuperman]

Hey everyone, don't forget about the css calc ability .

Try changing the template code to this:

Block Disabled:      (Update License Status)
Suspended or Unlicensed Members Cannot View Code.

See if that does it. I hate using style= in any css call, I prefer to define any css changes in the actual definition but sometimes when you customize a style or theme from another software a direct inline edit is required else you'll pull your hair out trying to figure out where you went wrong along the way lol.

So by saying go 100% we will but then we tell it to remove the spare 2px we noticed it increased. By using max-width we told it not to be bigger than 100% but somewhere as you can all plainly see something else bumped it up, I'd imagine some additional padding added somewhere along the line while you were customizing your style.

[MarkFL]

Originally Posted by TrultToast

Thanks for explaining. I was about to ask that question too, lol.
Any chance you could help me fix my forumhome template too? Sorry to be a bother... I tried using the code you supplied above in a few spots but I had no luck in fixing the borders in my statistics box.

Borrowing on Mike's suggestion, add this to your "additional.css" template:

Block Disabled:      (Update License Status)
Suspended or Unlicensed Members Cannot View Code.

This will make the statistics box 2px wider, rather than making the forums boxes 2px narrower. Either way will work though.

[TrultToast]

Thank you very much Mike and Mark!
When I tried Mikes suggestion. It sadly did nothing, but when I did what mark suggested and put Mikes code in my additional.css file under the class "#info", it did work.

Thank you both very much again!

edit:
Just out of curiosity, is there a reason why I need to keep adding this to some of my boxes? Like what did I do wrong to make 100% not work correctly without adding "width: calc(100% + 2px) !important;"??

[Seven Skins]

Originally Posted by TrultToast

Just out of curiosity, is there a reason why I need to keep adding this to some of my boxes? Like what did I do wrong to make 100% not work correctly without adding "width: calc(100% + 2px) !important;"??

Because vBulletin did not use Box Sizing whilst developing the forums hence we have issue. When you add borders to an element it get added to the element e.g. if you have 100px square element and you add 1px border the resulting box size will be 102px x 102px.

More info here: .. https://css-tricks.com/box-sizing/