width: auto will nicht funktionieren


#1
Hallo.
Verzweifle :oops:...

Folgender Code will einfach nicht wie ich will.
HTML:
<html>
    <head>
        <style type="text/css">

body {
    margin: 20px;
    background-color: #FF8040;
}
#kopf {
    width: 91%;
    height: 81px;
    overflow: auto;
    margin: 22 auto 0 auto;
    background-color: #ffff00;
}
#mitte {
    width: 91%;
    clear: both;
    margin: 22px auto
    }
        
#inhalt {
    margin-right: 22px;
    max-width:61%;
    height: 300px;
  background-color: #FFFFCC;
    }
#menu {
    float: right;
    width: 150px;
    height: 300px;
    margin-left: 22px;
    background-color: #ffcc00;
}
#fuss {
    clear: both;
    height: 50px;
    width: 91%;
    margin: 22 auto;
    background-color: #ff0;
}

        </style>
    </head>
<body>
<div id="kopf"></div>
<div id="mitte"><div id="menu"></div><div id="inhalt">12345</div></div>
<div id="fuss"></div>
    
</body>
</html>
Und zwar will ich erreichen, dass das div "inhalt" den gesamten Raum einnimmt zwischen "menu" und dem Rand der durch die Breite #mitte {width:91% }vorgegeben wird, einnimmt, mit einer margin von 22px.

Kann wer helfen?
 

EuroCent

Erfahrenes Mitglied
#6
Theoretisch hättest du es auch mit 100% hinbekommen :)

Das Auto impliziert einfach nur dass der Inhalt angepasst wird. Wenn kein Inhalt hinterlegt ist, wird er es auch nicht auf 100% breit machen da keine Referenz gegeben ist auf die er sich beziehen kann :)

Ggf. Inhalt einen inline-Block geben oder auf Flex zurück greifen :)