Javascript 如何在我的排行榜上修复这个意外的图像定位？

下面的代码创建了一个排行榜，用户排名从1到10，结果如下：

现在的问题是：如何摆脱排名第十的右倾。

我想这是因为10比其他数字宽。。。如果我想创建更多的排名，可能是46或更多，那么问题似乎更烦人

注意：我不想减小字体大小

代码如下：

JS

//这是将保存所有概要文件对象的数组
设profiles=[]；
让profile1={}；
profile1.name=“吉姆•鲍勃”；
profile1.job=“医生”；
轮廓1.点=1500；
profile1.level=15；
profile1.img=”https://randomuser.me/api/portraits/men/12.jpg";
profile1.imgDiamonds=“Diamonds.png”；
profiles.push（profile1）；
设profile2={}；
profile2.name=“Jane tanha”；
profile2.job=“牙医”；
2.2分=2000分；
profile2.level=1；
profile2.img=”https://randomuser.me/api/portraits/women/22.jpg";
profile2.imgDiamonds=“Diamonds.png”；
profiles.push（profile2）；
设profile3={}；
profile3.name=“迈克·琼斯”；
profile3.job=“Medic”；
profile3.0点=4000；
profile3.level=5；
profile3.img=”https://randomuser.me/api/portraits/men/22.jpg";
profile3.imgDiamonds=“Diamonds.png”；
型材、推（剖面3）；
设profile4={}；
profile4.name=“萨利·彼得森”；
profile4.job=“农业”；
profile4.0点=1900；
profile4.level=55；
profile4.img=”https://randomuser.me/api/portraits/women/24.jpg";
profile4.imgDiamonds=“Diamonds.png”；
profiles.push（profile4）；
设profile5={}；
profile5.name=“萨利·彼得森”；
profile5.job=“Pumper”；
剖面图5.点=1100；
剖面图5.1级=4级；
profile5.img=”https://randomuser.me/api/portraits/women/24.jpg";
profile5.imgDiamonds=“Diamonds.png”；
profiles.push（profile5）；
设profile6={}；
profile6.name=“萨利·彼得森”；
profile6.job=“母亲”；
profile6.0点=1400；
profile6.level=85；
profile6.img=”https://randomuser.me/api/portraits/women/24.jpg";
profile6.imgDiamonds=“Diamonds.png”；
profiles.push（profile6）；
设profile7={}；
profile7.name=“萨利·彼得森”；
profile7.job=“护士”；
profile7.7点=1400；
profile7.level=11；
profile7.img=”https://randomuser.me/api/portraits/women/24.jpg";
profile7.imgDiamonds=“Diamonds.png”；
profiles.push（profile7）；
设profile8={}；
profile8.name=“萨利·彼得森”；
profile8.job=“出租车潜水员”；
剖面图8.8点=1400；
profile8.level=17；
profile8.img=”https://randomuser.me/api/portraits/women/24.jpg";
profile8.imgDiamonds=“Diamonds.png”；
profiles.push（profile8）；
设profile9={}；
profile9.name=“萨利·彼得森”；
profile9.job=“高中生”；
剖面图9.9点=1400；
profile9.level=37；
profile9.img=”https://randomuser.me/api/portraits/women/24.jpg";
profile9.imgDiamonds=“Diamonds.png”；
profiles.push（profile9）；
让profile10={}；
profile10.name=“萨利·彼得森”；
profile10.job=“学生”；
轮廓10.0点=1500；
profile10.level=14；
profile10.img=”https://randomuser.me/api/portraits/women/24.jpg";
profile10.imgDiamonds=“Diamonds.png”；
profiles.push（profile10）；
//按点对数组排序
//b-a会先升到最高点，交换它们使a-b先升到最低点
配置文件.排序（函数（a，b）{
返回b点-a点；
})
让计数=1；
profiles.forEach（函数（条目）{
让profilesDiv=document.getElementsByClassName（'profiles'）[Math.floor（（count-1）/5]；
设img=document.createElement（'img'）；
img.className=“profilePic”；
img.src=entry.img；
让imgDiamonds=document.createElement（'img'）；
imgDiamonds.className=“profileDia”；
imgDiamonds.src=entry.imgDiamonds；
让profile=document.createElement（'div'）；
profile.className=“profile”；
profile.innerHTML=“”+entry.name+”；
让job=document.createElement（'span'）；
job.className=“job”；
job.textContent=entry.job；
个人资料.儿童（工作）；
配置文件。预结束（img）；
剖面图。预弯（imgDiamonds）；
设points=document.createElement（'span'）；
points.className=“points”；
points.textContent=entry.points；
配置文件。追加子项（点数）；
配置文件。预结束（img）；
剖面图。预弯（imgDiamonds）；
让level=document.createElement（'span'）；
level.className=“level”；
level.textContent=entry.level；
配置文件。附加子级（级别）；
配置文件。预结束（img）；
剖面图。预弯（imgDiamonds）；
var span=document.createElement（“span”）；
span.textContent=计数+'；
span.className=“计数”；
剖面预弯（span）；
档案iv.附录子项（档案）；
计数++；
});
.row{
显示器：flex；
}
.栏目{
弹性：50%；
}
.个人资料{
填充：10px；
利润率：100px 70px 0px 0px；
宽度：50%；
高度：60px；
框大小：边框框；
}
.profile.name{
右边距：-210px；
浮动：对；
宽度：200px；
高度：50px；
}
.简介.工作{
右边距：-210px；
边缘顶部：25px；
浮动：对；
宽度：200px；
高度：50px；
}
.profile.count{
浮动：左；
右边距：5px；
字体系列：“Helvetica Neue”；
字号：200；
src:url（helveticaneue ultrathin.woff）；
颜色：#E6E0EC；
字体大小：55px；
}
.profile img.profilePic{
位置：绝对位置；
余量：-50px 70px 50px 90px；
背景：#2f293d；
边框：1px实心#2p293d；
填充：4px；
边界半径：50%；
长方体阴影：.2rem.2rem 1rem rgba（0,0,0,5）；
}
.profile img.profileDia{
位置：绝对位置；
利润率：-10px 70px 50px 520px；
宽度：2%；
高度：自动；
}
.要点{
位置：绝对位置；
利润率：0px 100px 100px 450px；
浮动：对；
字体系列：“Helvetica Neue”；
字号：800；
src:url（helveticaneue ultrathin.woff）；
颜色：#008CBA；
}
.级别{
位置：绝对位置；
利润率：35px 100px 100px 230px；
浮动：对；
字体系列：“Helvetica Neue”；
字号：800；
src:url（helveticaneue ultrathin.woff）；
颜色：#ed0909；
字体大小：20px；
显示：块；
高度：60px；
宽度：60px；
线高：60px；
-moz边界半径：30px；
/*或50%*/
const placeDivs = document.querySelectorAll('.count');
const largestDivWidth = getLargestWidth(placeDivs);

function getLargestWidth(elements) {
  let largestNumber = 0;
  elements.forEach(element => {
    const elementWidth = element.clientWidth;
    if (elementWidth > largestNumber) largestNumber = elementWidth;
  });
  return largestNumber;
}

placeDivs.forEach(element => element.style.width = largestDivWidth);