Hallo, ich habe ein dropdown Menü erstellt, wobei ein Bild als Start ist. Das Ganze ist ein Button mit der witdth: 3%, ich musste allerdings für das Bild angeben, dass es 100% ist und somit nicht mehr als die 3% des divs einnimmt.
HTML:
CSS:
HTML
- .dropbtn {
- color: none;
- font-size: 16px;
- border: none;
- max-width: 3%;
- }
- .dropbtn img{
- display: block;
- max-width: 100%;
- }
- /* The container <div> - needed to position the dropdown content */
- .dropdown {
- position: fixed;
- }
- /* Dropdown Content (Hidden by Default) */
- .dropdown-content {
- display: none;
- position: absolute;
- background-color: none;
- min-width: 160px;
- box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
- z-index: 1;
- }
- /* Links inside the dropdown */
- .dropdown-content a {
- color: black;
- padding: 12px 16px;
- text-decoration: none;
- display: block;
- }
- /* Change color of dropdown links on hover */
- .dropdown-content a:hover {
- background-color: #ddd;
- }
- /* Show the dropdown menu on hover */
- .dropdown:hover .dropdown-content {
- display: block;
- }
- /* Change the background color of the dropdown button when the dropdown content is shown */
- .dropdown:hover .dropbtn {
- background-color: none;
- }
Wie mache ich es nun, dass der Link, also der Button, nur die 3% einnimmt und nicht die ganze Zeile?
Viele Dank!
