Wie erstelle ich ein absolutes Element, das mehrere Zeilen in einem Kalender (Tabellen-) Design überlappt?

Question

Ich versuche, einen Kalender in einem HTML -Tabellendesign mit CSS -Element -Divel -Elementen als Terminblöcke in der absoluten Positionierung zu erstellen, die gut funktioniert, aber da der Block absolut ist, wodurch ich so viele Zeilen überlappen kann, wie ich erstellen möchte Termine, es dehnt sich nicht horizontal aus, was ich will. Wie kann ich den absoluten Div -Block dehnen lassen? Oder gibt es eine bessere Lösung? (Einschränkung: muss IE6+) unterstützen. Das Problem wird unten hervorgehoben.

Unten finden Sie ein Snippet -Beispiel für den Code:

<table class="calendar_dayview_tableformatting">
..
<tr>
  <td class="calendar_dayview_cell">
    a href="#" class="calendar_dayview_dayformatting">09</a>
    <div class="preference">
      <div class="preference_appointment"></div>
    </div>
  </td>
</tr>
</table>

.preference {height: 60px; min-width:445px ; border: 1px solid #ffc61e; background-color: #ffc61e; margin-top: -1.4em; margin-left:2.5em; position:relative;}

.preference_appointment {height: 180px; min-width:445px ; border: 1px solid black; background-color: #f9eaad; position:absolute; margin-top:-1px;z-index:1;}

Answer 1

Wenn Sie die rechten und linken CSS -Eigenschaften angeben, erweitert sich die Breite des absolut positionierten Divs auf die Breite seines Containerversatzes durch die rechten und linken Eigenschaftswerte.

Können Sie bitte ein Beispiel von HTML sowie dem CSS bereitstellen.

Answer 2

Es wäre hilfreich, wenn Sie weitere Informationen zu Ihrem Problem veröffentlichen, einschließlich eines Beispiel -Markups und eines Links zu einer Demo -Seite.

Basierend auf dem, was Sie bisher gepostet haben, sieht es so aus, als würden Sie Minbreite verwenden, die wird nicht von IE6 unterstützt.

Wenn Sie die absolute Positionierung in IE verwenden möchten, müssen Sie auch eine vertikale Position (oben oder unten) und eine horizontale Position (links oder rechts) in absoluten (z. B. PX, EM) oder relativen Einheiten (z. B. %) angeben (z. B. links oder rechts). . Sie können auch nicht in IE6 links und rechts angeben, entgegen der früheren Antwort.

Abgesehen von diesen Einschränkungen klingt die absolute Positionierung so, als ob sie für das funktionieren sollten, was Sie in allen Browsern wollen, die Sie unterstützen müssen. Ohne weitere Informationen kann ich jedoch keine spezifischeren Ratschläge geben.