[CSS] nie działa css dla parenta Opcje

[shpaque]

Witam, od razu dodam ze konsola nic nie zwraca- zawsze dzialalo - tutaj nie. Chodzi o to ze po nacisnieciu inputa (:focus) nie zmienia mi ustawien css formularza

[HTML] pobierz, plaintext 
<style>
.search-home
{
	position: relative;
	min-width: 300px;
	max-width: 92%;
	height: 60px;
	padding: 12px;
	margin: 13px 0 20px 0;
	border: solid 3px rgba(0, 0, 0, 0.15);
	border-radius: 50px;
	background: rgba(255, 255, 255, 0.25);
	color: black;
	overflow: hidden;
}
 
.inputSearchHome
{
	display: inline-block;
	float: left;
	width: 85%;
	padding: 5px 0 0 10px;
	font-family: "Open Sans";
	font-size: 15px;
	text-align: left;
	border: none;
	outline: none;
	background: transparent;
	color: #464646;
}
 
.inputSearchHome:focus .search-home
{
	background: rgba(255, 255, 255, 0.5);
	border: solid 3px red;
}
 
.submitSearchHome
{
	display: inline-block;
	float: right;
	margin: 0 10px 0 0;
	width: 10%;
	text-align: right;
	background: transparent;
	border: none;
	outline: none;
	color: rgba(255, 255, 255, 0.5);
}
</style>
 
<form action="./search.php" method="get" class="search-home" name="widget-search-home">
	<input type="text" class="inputSearchHome" name="s" placeholder="Wyszukaj szkolenie" />
	<button type="submit" class="submitSearchHome"><span class="fa fa-search icon-md"></span></button>
</form>
[HTML] pobierz, plaintext 

Ten post edytował shpaque 29.06.2018, 13:27:15

[trueblue]

Poprzez input:before uzyskasz button? Jeśli Ci się uda, to tak zrób...

Podałem Ci jedno rozwiązanie bez dużej ingerencji w CSS.
Drugie rozwiązanie wymaga tego, aby input i/lub button pozycjonować absolutnie. Chyba, że button docelowo jednak będzie poza tą wielką ramką.