these are the css that I use, that Ning could integrate to all networks, I think they are important for people with little experience Ning 3.0 and for the elderly - Alex Rosas Negras and JOHN BAIZLEY

[Alex - Rosas † Negras]

 

 

i.icon.icon-envelope {width: 108px;}

i.icon.icon-friend-request {width: 145px; }

 

 mouse effect

/** BIZ VERSION **/
.ningbar-link .icon {
width:auto;
height:auto;
line-height:unset;
font-size:15px;
overflow:visible;
}
.ningbar-list{
padding-left:10px;
}
.ningbar-countNotification {
right: -15px;
font-size:10px;
}
i.icon.icon-envelope,
i.icon.icon-friend-request{
margin-right:15px;
}

 

[Bizz]

You don't change the width of the envelope you change it's font size, as the link bar icons are actually fonts so you just change them with font-size not width.

for instance

i.icon.icon-envelope {font-size: 20px;}

To get the words to show up with the icons and size them you could use this rather than setting fixed widths as it will allow for the growth of the notifications count

.ningbar-link .icon {
font-size: 20px;
line-height: auto;
height: auto;
}

[Alex - Rosas † Negras]

this is your result, this is the result now in this site with these css

https://ladiesofthehat.org/

[Alex - Rosas † Negras]

i.icon.icon-envelope {width: 120px;}

i.icon.icon-friend-request {width: 90px; }

https://ladiesofthehat.org/

[Alex - Rosas † Negras]

Bizz  

you take a picture of your site and what css you are using please, we try to fix everything, each site at its size but they change little, I who use a lot of css like you is very different

[Alex - Rosas † Negras]

Bizz 

automatically widens brother I took a test

[Bizz]

Sorry my mistake, I missed a line out, it should be

.ningbar-link .icon {
font-size: 20px;
line-height: auto;
height: auto;
width:auto;
}

[Alex - Rosas † Negras]

it was a good idea but the messages overlap with the writing

[Bizz]

Thats what is supposed to do by default, you can adjust it by using this and enter a value that you want to move it by,

the default is -8px

.ningbar-countNotification { right: -8px }

[Alex - Rosas † Negras]

it does not give the useful space for the icon I tried to center it but nothing to do John

[Bizz]

You can add some space by giving a little margin to the other links like this, change value for what you want.

.ningbar-list{ margin-left:10px }