Autor |
Nachricht |
niederberger
Threadersteller
Dabei seit: 26.07.2005
Ort: Buochs NW - Schweiz
Alter: 46
Geschlecht:
|
Verfasst Di 19.05.2009 08:18
Titel <tr> Float in IE7 |
|
|
Hallo Zusammen
Ich suche nach einer Möglichkeit <tr> nebeneinander zu floaten - also jeweils 2 sollten nebeneinander zus tehen kommen. DIVs können in diesem Fall nicht eingesetzt werden. Einwandfrei funktioniert es mir in Firefox, Safari etc. Folgenden CSS-Code setze ich ein:
Code: |
.ContentColums table {
width:520px;
}
.ContentColums tr {
width:260px;
float:left;
}
|
So kuckt die Tabelle aus:
Code: |
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>Text 1</td>
</tr>
<tr>
<td>Text 2</td>
</tr>
<tr>
<td>Text 3</td>
</tr>
</table>
|
Jemand eine Idee wo das Problem liegen könnte?
Danke, Thomas.
|
|
|
|
|
Krisslinger
Dabei seit: 21.04.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 19.05.2009 08:29
Titel
|
|
|
Ich bin mir nicht sicher was du damit bezwecken willst, aber eigentlich floaten man tr nicht. Table Row sind eben die Zeilen in den Tabellen, für die Spalten sind tds zuständig.
Ich würde einfach mal vorschlagen, dein Vorhaben so umzusetzen
Code: |
.ContentColums td {
width:260px;
}
|
Code: |
<table>
<tr>
<td>Text 1</td>
<td>Text 2</td>
<td>Text 3</td>
</tr>
</table>
|
Klär mich auf, wenn ich dich falsch verstanden habe.
Zuletzt bearbeitet von Krisslinger am Di 19.05.2009 08:30, insgesamt 1-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 19.05.2009 08:33
Titel
|
|
|
So ist es, merkwürdige Idee die du da umsetzen willst. Wenn du Elemente in einer Tabelle
nebeneinander ausrichten möchtest dann nutzt du dazu natürlich Zellen …
|
|
|
|
|
niederberger
Threadersteller
Dabei seit: 26.07.2005
Ort: Buochs NW - Schweiz
Alter: 46
Geschlecht:
|
Verfasst Di 19.05.2009 08:36
Titel
|
|
|
Ich weiss, das Vorgehen ist alles andere als ideal, geschweige den schön. Ich setzte parallel dazu noch ein JavaScript ein, das mit ein Page Browsing ermöglicht. Dieses benötigt <tr>'s. Dieses Javascript zeigt jeweils nur 5 resp. 10 Einträge an, dann kommt der nächte Block. Wäre ja soweit noch kein Problem, aber es muss Zweispaltig sein, dh dass jeweils jeder zweite Eintrag in der 2 Spalte zu stehen kommen muss. Daher auch die TR nebeneinander...
|
|
|
|
|
Smooth-Graphics
Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst Di 19.05.2009 08:40
Titel
|
|
|
Schreib das Javascript um?
|
|
|
|
|
niederberger
Threadersteller
Dabei seit: 26.07.2005
Ort: Buochs NW - Schweiz
Alter: 46
Geschlecht:
|
Verfasst Di 19.05.2009 08:45
Titel
|
|
|
Dafür reicht die Zeit sowie mein Wissen nicht...
Sollte doch möglich sein mit einem IE Hack...
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Di 19.05.2009 08:47
Titel
|
|
|
Kannst du mal erklären was du eigentl erreichen möchtest?
|
|
|
|
|
niederberger
Threadersteller
Dabei seit: 26.07.2005
Ort: Buochs NW - Schweiz
Alter: 46
Geschlecht:
|
Verfasst Di 19.05.2009 08:51
Titel
|
|
|
Ich habe eine Liste mit 20 Menüeinträgen (Navigationspunkte aus Typo3). Diese habe ich jeweils in ein <tr><td> gewrapt um dann mit dem Javascript ein Pagebrowsing hinzukriegen, es sollen ja jweils nur 5 Menueinträge angezeigt werdne, dann mit klick auf den Pfeil kommen die nächsten fünf Einträge. Folgendes Javascript setz ich ein:
HTML Dokument (Condition funktioniert nicht - jemand da eine Idee?)
Code: |
<script type="text/javascript">
<!--[if IE 6]>
var pager = new Pager('results', 5);
<!--[endif]-->
var pager = new Pager('results', 10);
pager.init();
pager.showPageNav('pager', 'PagingPosition');
pager.showPage(1);
</script>
|
Code: | function Pager(tableName, itemsPerPage) {
this.tableName = tableName;
this.itemsPerPage = itemsPerPage;
this.currentPage = 1;
this.pages = 0;
this.inited = false;
this.showRecords = function(from, to) {
var rows = document.getElementById(tableName).rows;
// i starts from 1 to skip table header row
for (var i = 1; i < rows.length; i++) {
if (i < from || i > to)
rows[i].style.display = 'none';
else
rows[i].style.display = '';
}
}
this.showPage = function(pageNumber) {
if (! this.inited) {
alert("not inited");
return;
}
var oldPageAnchor = document.getElementById('pg'+this.currentPage);
oldPageAnchor.className = 'pg-normal';
this.currentPage = pageNumber;
var newPageAnchor = document.getElementById('pg'+this.currentPage);
newPageAnchor.className = 'pg-selected';
var from = (pageNumber - 1) * itemsPerPage + 1;
var to = from + itemsPerPage - 1;
this.showRecords(from, to);
}
this.prev = function() {
if (this.currentPage > 1)
this.showPage(this.currentPage - 1);
}
this.next = function() {
if (this.currentPage < this.pages) {
this.showPage(this.currentPage + 1);
}
}
this.init = function() {
var rows = document.getElementById(tableName).rows;
var records = (rows.length - 1);
this.pages = Math.ceil(records / itemsPerPage);
this.inited = true;
}
this.showPageNav = function(pagerName, positionId) {
if (! this.inited) {
alert("not inited");
return;
}
var element = document.getElementById(positionId);
var pagerHtml = '<div id="Paging"><span onclick="' + pagerName + '.prev();" style="color:#00a5e9; font-weight:bold;">‹</span> ';
for (var page = 1; page <= this.pages; page++)
pagerHtml += '<span style="font-size:11px;" id="pg' + page + '" onclick="' + pagerName + '.showPage(' + page + ');">' + page + '</span> ';
pagerHtml += '<span onclick="'+pagerName+'.next();" style="color:#00a5e9; font-weight:bold;">›</span></div>';
element.innerHTML = pagerHtml;
}
}
|
Grüsse, Thomas.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Hilfe: div float / width:100% - CSS float Box Model
div und float
[css] IE und float
Css FLOAT
[css] float und xp
float problem
|
|