My search bar will not scale to the appropriate dimension when I readjust the dimension of my home window.
Below ist my code
<< body>>.
<< header>>.
<< div course=" roladeck-main">
<> < nav course=" nav-bar">
<> < ul>>.
<< li>>.
<< a>>.
<< h2>> Example<.
<.
<.
<< li>>.
<< type>>.
<< input for=" websearch" kind=" message" placeholder=" Look for cards ..." called for dimension=" 1"/>
<> < switch id=" websearch" kind=" send">
<> < img src=" Pictures/search-icon. png" alt=" Browse" elevation=" 10">
<> .
<.
<.
<< li>>.
<< a>>.
<< h2>> Example<.
<.
<.
<.
<.
<.
<.
<< body>>.
below is the design sheet:
nav-bar {
screen: flex;
overflow: concealed;
}
. nav-bar ul {
extra padding: 0px;
margin: 0px;
overflow: concealed;
}
. nav-bar li: float {
history: rgb( 197, 197, 197);
}
. nav-bar li {
shade: rgb( 255, 255, 255);
text-decoration: none;
extra padding: 10px;
screen: block;
text-align: facility;
float: left;
}
. nav-bar input {
min-width: 200px;
size: 50%;
}
I attempted removing the float left of the design sheet which permits the search bar to range, yet it maintains my listing components from aligning.
