html - 使链接背景与容器一样宽

Question

如何使链接的背景与它所在的容器一样宽？
我当前的代码:

.menu {
	width: 500px;
	height: 100%;
	background-color: gray;
	left: 0;
	top: 0;
	position: fixed;
}

.menu_content {
	top: 50px;
	position: relative;
	width: 100%;
}

a.menuBtn, a.menuBtn:visited {
	background-color: blue;
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 500px;
	text-decoration: none;
	color: white;
}

<div class="menu">
		<div class="menu_content">
			<a href="#" class="menuBtn">Start</a>
			
		</div>
	</div>

我希望无论链接文本多长，蓝色背景和灰色背景一样宽。链接文本距左侧 20px。

目前，由于填充，如果文本较长，蓝色背景会变宽。尝试了 padding-right: 100% 但显然没有用。 值得一试

Answer 1

a.menuBtn{
显示: block ；
}

并删除 padding-right:500px