Attention:

Support Rules and Guidelines
Before you post your support topic, please remember to:
  • Read the support forum rules.
  • Check the wiki and use search to see if your problem can be answered there first.
  • Link your board please, and make sure that the problem on your board is visible to guests or provide a test account.
  • Do not post Board Wrappers and CSS unless requested. With a board link, this is not necessary.
  • Be as descriptive as you can and use as many details as possible when describing your problem.
  • Please briefly mark any links to forums that may not be work-safe.
This will help ensure your support issue will be attended to in a quick and efficient manner.

  Add ReplyNew TopicNew Poll

 Mini Profile Issue on Firefox
#
So, having previously used chrome and then opera, I've sorted through the mini profile only to discover now on Firefox that the coding looks weird here. The posts words overlaps with the number of posts.

user posted image
This is what it looks like on Firefox.

Meanwhile, on Edge (also works fine on Chrome and Opera):
user posted image

The board

So just wondering what I can do here to make it work fine on all forums?

This post has been edited by LizFirestarter: Jul 10 2016, 04:18 AM
PM
#
This is a tough one because I can't find why firefox is rendering it slightly differently.

This is terrible practice to target a browser specifically, but you use the following css to do so and add a margin-bottom to create space:

CODE

 .posts-text {
    font-size: 28px;
 }

@-moz-document url-prefix() {
 .posts-text {
    font-size: 28px;
    margin-bottom: 2px;
 }
}


And change the font tag to a span tag with a class of .posts-text -- let me know how it looks now.

signature
email: admin@jcink.com :: blog: John C.
#
I didn't expect an issue in FF. Usually, it doesn't for this sort of thing.

I'm having trouble following:

QUOTE
And change the font tag to a span tag with a class of .posts-text -- let me know how it looks now.


I don't have a font tag in mini profile. They're div classes. I have a font size alteration for posts from when someone here helped me adjust that to fit the three lines to the right.

John
PM
#
That's what I'm saying. You do have a font tag in your mini profile HTML.

CODE
<font size="28px">(some number)</font>


Which is probably, in the template itself:

CODE
<font size="28px"><!-- |posts| --></font>


Remove this, replace it with:

CODE
<span class='posts-text'><!-- |posts| --></span>


And then use my CSS and see what happens. adjustments may be necessary.,

signature
email: admin@jcink.com :: blog: John C.
#
Okay, so I also had to dablle with the posts-text size without px to make the post number itself bigger again and get rid of the overall font-size for the code since it was just killing it.

One more bit of issue before I can leave you alone. The posts and the word posts pushed down when I did all this. It's not centered anymore. I tried playing with the margins of the code section but it's all related to the box itself so anything I do screws with the position of the box.

CODE

.mashmpcatc {
float: left;
background: #000;
width: 125px;
height: 42px;
padding: 10.5px 0;
margin-top: 2px;
border-left: solid 5px #0B6008;
font-family: courier;
text-transform: uppercase;
line-height: 18px;
color: #555;
}


user posted image

Anything I can add to make it centered in heigh? Or a special text like margin to fix posts higher within the box so it doesn't mess with the box itself?

John
PM
#
Make the line-height: 9px; on that CSS you posted first

Then add to the posts-text CSS

CODE
display: inline-block; margin-bottom: 15px;

signature
user posted image
#
Okay, line-height at 10.5px and margin-bottom at 12px does the trick. It overlaps still in FF though not as painfully so. Plus it's perfect for Edge which I also went and checked.

Thanks, guys!
PM
0 User(s) are reading this topic (0 Guests and 0 Anonymous Users)
0 Members:
Share this topic:
« Next Oldest | General Support | Next Newest »

Options Add ReplyNew TopicNew Poll