Javascript 无法完全隐藏材质UI卡边框

我试图将卡片与背景进行伪装/混合，但是小角落仍然暴露在外。我花了几个小时寻找解决方案，但没有一个有效。我尝试了很多方法来修复它，比如在CSS中调整边界半径等，但它仍然不起作用

以下是我的.CSS和.JS文件：

import React，{useState，useffect}来自“React”；
导入“/App.css”；
进口{
MenuItem，
FormControl，
选择，
卡片
卡片内容，
}来自“@材料界面/核心”；
从“/InfoBox”导入InfoBox；
从“/LineGraph”导入线条图；
从“/Table”导入表；
从“/util”导入{sortData，prettyPrintStat}；
从“数字”中导入数字；
从“/Map”导入地图；
导入“传单/目录/传单.css”；
常量应用=（）=>{
const[country，setInputCountry]=useState（“全球”）；
const[countryInfo，setCountryInfo]=useState（{}）；
const[countries，setCountries]=useState（[]）；
const[mapCountries，setMapCountries]=useState（[]）；
const[tableData，setTableData]=useState（[]）；
const[casesType，setCasesType]=useState（“案例”）；
const[mapCenter，setMapCenter]=useState（{lat:34.80746，lng:-40.4796}）；
const[mapZoom，setMapZoom]=useState（3）；
useffect（（）=>{
取回（“https://disease.sh/v3/covid-19/all")
.then（（response）=>response.json（））
。然后（（数据）=>{
setCountryInfo（数据）；
});
}, []);
useffect（（）=>{
const getCountriesData=async（）=>{
取回（“https://disease.sh/v3/covid-19/countries")
.then（（response）=>response.json（））
。然后（（数据）=>{
const countries=data.map（（国家）=>({
姓名：country.country，
值：country.countryInfo.iso2，
}));
让sortedData=sortData（数据）；
国家（国家）；
SETMAP国家（数据）；
可设置数据（sortedData）；
});
};
getCountriesData（）；
}, []);
控制台日志（casesType）；
const onCountryChange=异步（e）=>{
const countryCode=e.target.value；
常量url=
国家代码==“全球”
? "https://disease.sh/v3/covid-19/all"
: `https://disease.sh/v3/covid-19/countries/${countryCode}`；
等待获取（url）
.then（（response）=>response.json（））
。然后（（数据）=>{
setInputCountry（国家代码）；
setCountryInfo（数据）；
setMapCenter（[data.countryInfo.lat，data.countryInfo.long]）；
setMapZoom（4）；
});
};
返回(
新冠病毒-19跟踪器
在全世界
{国家地图（（国家）=>(
{country.name}
))}
setCasesType（“案例”）}
title=“冠状病毒病例”
伊斯雷德
活动={casesType===“cases”}
案例={prettyPrintStat（countryInfo.todayCases）}
总数={数字（countryInfo.cases）.format（“0.0a”）}
/>
setCasesType（“已恢复”）}
title=“已恢复”
活动={casesType===“已恢复”}
案例={prettyPrintStat（countryInfo.today已恢复）}
总计={数字（countryInfo.recovered）.format（“0.0a”）}
/>
setCasesType（“死亡”）}
title=“死亡”
伊斯雷德
活动={casesType===“死亡”}
案例={prettyPrintStat（countryInfo.todaydeads）}
总数={数字（countryInfo.Deathers）.format（“0.0a”）}
/>
按国家分列的活病例
全球新{casesType}
);
};
导出默认应用程序
*{
保证金：0；
}
.身体{
背景色：#000000；
}
.app{
显示器：flex；
对正内容：空间均匀；
背景色：#000000；
填充：20px；
}
.app_u下拉列表{
边界半径：10px；
背景色：rgb（24,24,24）；
}
.app_uu下拉列表.MuiInputBase根{
颜色：#ececec；
}
.app_u下拉列表.MuiSelect图标{
颜色：rgb（245245245245）；
}
.应用程序标题{
显示器：flex；
对齐项目：居中；
边缘底部：20px；
证明内容：之间的空间；
}
.app__头>h1{
颜色：#ececec；
字号：2rem；
}
.app__左{
弹性系数：0.9；
}
.app__统计数据{
显示器：flex；
证明内容：之间的空间；
}
.app\u stats.MuiTypography根目录{
颜色：#ececec；
}
.app_uu对{
显示器：flex；
弯曲方向：立柱；
}
.app_uuright.MuiCardContent root{
背景色：黑色；
边界：无；
}
.应用程序信息>h3{
颜色：#ececec；
字体大小：400；
字体大小：1.5rem；
边缘底部：1rem；
}
.app__信息>h3：类型的最后一个{
页边顶部：1rem；
}
@介质（最大宽度：990px）{
.app{
弯曲方向：立柱；
}
}
退房。我想您应该在正在渲染的组件中说“elevation={0}”。换句话说，我不认为这是一个真正的边界值。我必须为React中的一个应用程序执行此操作，它工作正常。
看起来确实像是边界半径泄漏。也许在内部内容上增加一点比例会起作用<代码>转换：缩放（1.1）

hacky但不是tooo hacky我刚才试过，但它只占据了屏幕的一半。显然，你必须正确调整数字