Suche im Forum:
Suchen


Autor Nachricht
Beitrag12.10.2014 um 21:17 (UTC)    
Titel: Tabelle skaliert sich

Guten Tag,

ich hab folgendes Problem: Ich habe einer Spalte einer Tabelle feste Höhen (in px) gegeben, lediglich die letzte Zeile hat die Angabe 100% Höhe erhalten. Wenn ich die Spalte daneben (zu einer Zelle verbunden) nun vergrößere, werden die Zellen der anderen Spalte, deren Werte festgelegt sind, trotzdem mit skaliert, dabei sollte nur die letzte Zeile skalieren.

Der Code ist viel zu groß, um ihn hier zu posten.
Dieser Effekt tritt nicht in Google Chrome auf, jedoch in Firefox und im IE.
Hier eine Testseite: http://www.busbild.com/f.htm
In diesem Fall geschieht es beim aufklappen der Texte weiter unten.

Weiß jemand Rat?
Beitrag13.10.2014 um 15:55 (UTC)    
Titel:

Hallo,

Tabellen(zellen) nehmen sich normalerweise den Platz, den sie brauchen.
Wenn du die Tabelle 300px hoch machst, der Inhalt aber 350px braucht, wird sie auch 350px hoch.
Es gibt im Prinzip zweieinhalb Möglichkeiten, dafür zu sorgen, dass sich die Tabelle nicht eigenmächtig vergrößert:
1. Man könnte die Tabelle durch Div-Elemente ersetzen. Ist vom Code her auch nicht schlimmer und lässt sich (meiner Meinung nach) besser beherrschen. Da könnten beide Spalten auch verschiedene Höhen haben.
2. Du könntest die Tabelle von vornherein 355px hoch machen. Wenn sie ohnehin so groß wird, sieht es immerhin besser aus, als wenn sie beim Ausklappen "wächst"...
2,5. Du könntest den Inhalt der rechten Spalte verringern. In dem Beispiel würde es schon reichen, diesen großen Absatz im Text rauszunehmen. Das wäre natürlich nur sehr bedingt praktikabel, wenn man mal etwas mehr schreiben möchte.

Ich hoffe, ich konnte dir etwas helfen.

Gruß,
TransInt
______________
Kein Support per PN - Im Forum hilft es allen!

Life is what happens while you are busy making other plans.
- John Lennon
Beitrag13.10.2014 um 21:28 (UTC)    
Titel:

Danke, deinen Vorschlag mit den Div-Elementen habe ich umgesetzt, jedoch stieß ich auch hier auf ein neues - wenn auch altes - Problem.
Die "Box_Bottom" soll immer unter der Box "f5" bleiben, jedoch auch immer bis zum unteren Bildschirmrand führen. Wenn ich also in die "Boxbig" so viel schreibe, dass ich scrollen muss und diese dann auch bis zum unteren Bildschirmrand geht, sollte die "Box_Bottom" auch wieder bis zum Bildschirmrand gehen.

Die Seite:
Code:
    <link href="type_site_frame.css" type="text/css" rel="stylesheet" />
<body bgcolor="#e3d3e3" >
<div class="ueberschrift1">Mercedes-Benz O 405 NK</div>
<div class="ueberschrift2">Niederflur-Linienbus Kurz</div>
<hr style="border:solid #808080 1px; height:2px;" />
<div class="boxbig">Boxbig</div>
<div class="box1">f1</div>
<div class="box2">f2</div>
<div class="box3">f3</div>
<div class="box4">f4</div>
<div class="box5">f5</div>
<div class="box6">Box_Bottom - Ich soll hier anfangen und immer bis zum unteren Bildschrimrand gehen.</div>

</body>


Die CSS-Datei:
Code:

.box1 {
    width: 100%;
    height: 300px;
    background-color: #d3d3d3;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: #808080;
    border-top-width: 2px;
    border-top-style: solid;
    border-top-color: #808080;
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #808080;

}
.box2 {
    width: 100%;
    height: 40px;
    background-color: #d3d3d3;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: #808080;
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #808080;

}
.box3 {
    width: 100%;
    height: 40px;
    background-color: #d3d3d3;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: #808080;
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #808080;

}
.box4 {
    width: 100%;
    height: 40px;
    background-color: #d3d3d3;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: #808080;
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #808080;

}
.box5 {
    width: 100%;
    height: 40px;
    background-color: #d3d3d3;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: #808080;
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #808080;

}
.box6 {
    width: 100%;
    height: 50%;
    background-color: #d3d3d3;
    border-left-width: 2px;
    border-left-style: solid;
    border-left-color: #808080;
    border-right-width: 2px;
    border-right-style: solid;
    border-right-color: #808080;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    border-bottom-color: #808080;
    position: relative;
    bottom: 0px;

}
.boxbig {
    background-color: #d3d3d3;
    width: 65%;
    height: 485px;
    float: right ;
    position: relative;

}
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de