• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Tabelle -Layout Hilfe

cyberurmel

Neues Mitglied
Hallo erstmal,

ich habe ein Problem bei dem ich Euch um Hilfe bitte. Es geht um die Anzeige in einer Tabelle. Wie Ihr auf dem Bild sehen könnt ist eine Verschiebung in den Daten drin durch die erhöhung der Dezimalen. Ich dachte wenn ich da Tabelle mache mit ausrichtung links rechts etc bekomme ich das in den Griff, dass es immer untereinander steht. Aber da ich so ziemlich keine Ahnung von html und Co habe , und nach mehreren Versuchen alles hinbekommen habe nur das nicht bitte ich um Hilfe.
Der Code der .html datei ist hier :
Code:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  {foreach name=outer item=options_data from=$options}
  <tr>
    <td valign="top" class="main" width="1%"><b>{$options_data.NAME}:</b>&nbsp;</td>
    <td class="main" width="99%">
  {foreach key=key_data name=key_data item=item_data from=$options_data.DATA}
    <input type="radio" name="id[{$options_data.ID}]" value="{$item_data.ID}" {if $smarty.foreach.key_data.first}checked="checked" {/if} />
    &nbsp;&nbsp;&nbsp;{$item_data.TEXT} {if $item_data.PRICE!=''} &nbsp;({$item_data.PREFIX}{$item_data.PRICE}) {$item_data.ATTR_VPE}{/if}
    <br />
  {/foreach}
</td>
  </tr>
  {/foreach}
</table>
und so sieht es im moment aus :
bild1.jpg

Danke für Hilfe...

Ich denke es ist eine Zeile mit 2 Spalten 1 und 99 % . Alle Versuche die 2 Spalte so zu machen dass es passt ist wohl der Schlüssel.
Die Mengenangabe vorne ,dann der Euro Betrag je rechtsbündig pro Zelle , das Wort Grundpreis mittig in Zelle und der Rest wieder rechtsbündig in Zelle müsste doch passen?
Nur wie machen?? :(


greets
 
Wieso willst du die 3 Angaben denn in 1 Spalte quetschen? Tabellen sind extra dazu gedacht um Daten anzuordnen. 4 Spalten wäre viel einfacher...
Ansonsten würde ich dir den Gebrauch von 3 Divs empfehlen: 1 Div für den Euro-Betrag, etc. Den ersten Beiden würde ich den Style "float: left;" geben, dem Mittleren zusätzlich den Style "margin: 0 auto;" und dem Rechten einfach "float: right;".
 
Hi Dark Dragon,

will ich doch gar nicht - hatte doch geschrieben :

"Die Mengenangabe vorne ,dann der Euro Betrag je rechtsbündig pro Zelle , das Wort Grundpreis mittig in Zelle und der Rest wieder rechtsbündig in Zelle müsste doch passen?"

das wären ja 4 . Habe Zelle anstatt Spalte geschrieben.

Aber wie mache ich das in dem Fall ? Wie gesagt - bin in Html & css so gut wie in arabisch sprechen :lol:
Also so wie ich das verstehe, wird diese Tabelle wie im code drin einfach nach unten kopiert durch dieses for each oder? Und die Abfragen entsprechend dort eingefügt.

Es soll ja so bleiben wie bisher "nur" eben geordnet. Div? kann man das einfach so eingeben?
thx vorab
greets

ich habe mal hier geschaut... aber da kommt ja dann schon wieder ein verweis auf .css nutzen?
:-))
oh je :-)



danke für hilfe
greets
 
Gut, dann hab ich das - wie so oft oO - falsch verstanden. :D
Nunja, dann musst du eigentlich nur etwas umarrengieren (ich liebe dieses Chaos):
HTML:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  {foreach name=outer item=options_data from=$options}
  <tr>
    <td valign="top" class="main" width="1%"><b>{$options_data.NAME}:</b>&nbsp;</td>
    <td class="main" width="1%">
  {foreach key=key_data name=key_data item=item_data from=$options_data.DATA}
    <input type="radio" name="id[{$options_data.ID}]" value="{$item_data.ID}" {if $smarty.foreach.key_data.first}checked="checked" {/if} />
    </td>
    <td style="text-align: left" class="main" width="22%">
    {$item_data.TEXT}
    </td>
    {if $item_data.PRICE!=''}
    <td style="text-align: right" class="main" width="22%">({$item_data.PREFIX}{$item_data.PRICE})
    </td>
    <td style="text-align: right" class="main" width="22%">
      {$item_data.ATTR_VPE} <!-- Leider etwas schwer zu sagen, was worin steckt.
          Hier denke ich mal Grundpreis & der Rest. -->
    </td>
    {/if}
  {/foreach}
</td>
  </tr>
  {/foreach}
</table>
Aber sag mal, kann es sein, dass dein "Rest" auch alles in $item_data.ATTR_VPE ist? Dann ist es nämlich schwerer, diesen rechtsbündig vom Rest zu trennen.

Ein schönes durcheinander hast du da... Das hat mich gerade mehr als 10 Minuten gekostet. :P Ich kann auch nicht garantieren, dass alles seiner Richtigkeit entspricht... Foreach-Schleifen mache ich lieber mit PHP.
 
Hi DarkDragon,

erstmal vielen Dank. Ich habe das mal so eingebaut und genau denselben Effekt hatte ich auch schon mal hinbekommen beim probieren:
bildtab.jpg

das mit den Inhalten kann man dann ja varieren,wenn mal das Gerüst steht.
Ich vermute allerdings ich muss es so machen wie du zuerst geschrieben hattest :
div oder span tags machen mit den entsprechenden Angaben links,rechts und und
Hab das zwar noch nie gemacht aber vielleicht hast du ja ne idee oder guter link für anfänger?
greets
Cyb
 
Wow, da kann man ja gar nichts mehr lesen!
Nagut, ich hoffe einer der Erfahreneren Benutzer hier können dein Debakel eleganter lösen, oder zumindest einen Schubs in die richtige Richtung geben. Es ist wahrscheinlich besser wenn du dir das selbst aneignest: Selfhtml - CSS Tutorial
Damit lernst du mittels CSS deine Seiten zu strukturieren.

Ansonsten würde ich das ungefähr so angehen:
HTML:
<table>
	<tr>
		<td width="800">
			<div style="float: left; text-align: left; width: 25%;">Foo</div>
			<div style="float: left; text-align: right; width: 25%;">Preis</div>
			<div style="float: left; text-align: center; width: 25%;">Grundpreis</div>
			<div style="float: left; text-align: right; width: 25%;">Rest</div>
		</td>
	</tr>
</table>
Ich hab hier jetzt einfach mal die Tabelle auf 800 Pixel festgelegt um zu veranschaulichen, was passiert... Hoffe, das hilft dir. :D
 
Hi Dark Dragon,

danke dir. Ich werde es morgen mal testen :)
Debakel ist gut ..lol..
denke eher es liegt an meinem nichtwissen..
ich schau es mir mal an..hab auch noch ne CD hier mit CSS für Anfänger.
thx vorab
greets
 
So hab es eingebaut und sieht noch schlimmer aus :-)
Kann es sein, dass diese class=main (ist doch css Anweisung oder?) hier noch "reinfunkt"?
Wenn ich den Code einfach so eingebe in ner .html datei passt es nämlich. Bau ich den dort ein verschiebt es sich ohne ende ab dem zweiten Feld vom input button.

??
greets
 
Natürlich kann es sein, dass die Klasse "main" da noch "mit rein funkt". Es ist möglich in HTML einem Element eine ID, mehrere Klassen und weiteren Style-Code hinzuzufügen. Alles kann das jeweilige Element gleichzeitig beeinflussen... :P
 
Zurück
Oben