Abstand html

[imac123]

Hallo

Wie kann ich im HTML so etwas machen? mit so einem schönem/grossem abstand? und in eine gerade Linie?

Ich habe probiert mit ul, ol aber geht nicht wirklich super, mit Tabellen auch nicht.

 

[cythux]

AW: Abstand html

Mittels CSS http://www.w3.org/TR/css3-box/
http://css-tricks.com/box-sizing/
http://reference.sitepoint.com/css/boxmodel

 

[patrick_l]

AW: Abstand html

Freunde dich mit CSS und dem Boxmodell an. Cythux hat ja bereits ein paar Links dazu gepostet. Auch von mir zum Lernen ein paar Verweise, um dich schneller zurecht zu finden. Einmal allgemein HTML und CSS sowie speziell das Boxmodell.

- HTML5-Handbuch - Webkompetenz
- Einführung in XHTML, CSS & Webdesign (Michael Jendryschik)
- Michael Jendryschik » Das CSS-Boxmodell
- Little Boxes | Webseiten gestalten - HTML & CSS (Peter Müller)
- CSS 4 You - The Finest in Stylesheets

Liebe Grüße, Patrick

 

[d4y]

AW: Abstand html

Hier noch etwas zum Boxmodell http://www.codecademy.com/courses/advanced-css-positioning/0/1

Gruss Frank

 

[FlashZange]

AW: Abstand html

Nix gegen Boxmodell, aber ist das nicht das Musterbeispiel für eine stinknormale Tabelle?
Wäre meiner Meinung nach semantisch doch sinnvoller?

Liebe Grüße

 

[d4y]

AW: Abstand html

Nix gegen Boxmodell, aber ist das nicht das Musterbeispiel für eine stinknormale Tabelle?
Wäre meiner Meinung nach semantisch doch sinnvoller?

Liebe Grüße

Nur das man heutzutage Tabellen nicht mehr zur Formatierung benutzt

 

[cebito]

AW: Abstand html

Nix gegen Boxmodell, aber ist das nicht das Musterbeispiel für eine stinknormale Tabelle?
Wäre meiner Meinung nach semantisch doch sinnvoller?

Liebe Grüße

Lies mal hier , semantisch richtig also eher als Definitionsliste.
Ansonsten haben Tabellen natürlich auch ihre Berechtigung, ich zitiere mal aus dem von mir verlinkten Text

Eine dargestellte Tabelle macht dann Sinn, wenn die Spalten der Reihen zueinander in Bezug stehen oder zu vergleichen wären.

 

[FlashZange]

AW: Abstand html

In dem Fall benutze ich die Tabelle doch nicht, um das Layout zu gestalten, sondern um Eigenschaften Werte zuzuordnen oder? Ich zweifel grad ein wenig an mir

Liebe Grüße

EDIT: @cebito danke für den Link, daran hab ich bisher noch gar nicht gedacht. Wenn ich nur einen Wert habe, scheint das eine gute Lösung zu sein.

 

[imac123]

AW: Abstand html

Ich habe es so gemacht, funktioniert auch.

<div id="personalien">
<p><strong class="ich">Geboren:</strong> <span id="ich1">02.0x.1xxx in xxxx</span></p>
<p><strong class="ich">Sprachen:</strong> <span id="ich2">xxxxxxxx</span></p>
<p><strong class="ich">Nationalit&auml;t:</strong> <span id="ich3">xxxxxxxx</span></p>
<p><strong class="ich">Zivilstand:</strong> <span id="ich4">xxxxxx</span></p>
<p><strong class="ich">Hobby's:</strong> <span id="ich5">xxxxxxxxxxxxx</span></p>
<p><strong class="ich">AHV Nr:</strong> <span id="ich6">1xxxxxxx</span></p>

</div>

/*---anfang geboren,zivilstandd,hobby usw---*/
.ich{
	color:brown;
	background-color:#F5FAD7;
	}
#ich1{margin-left:2.500em;}
	
#ich2{margin-left:2.063em;}

#ich3{margin-left:1.125em;}
	
#ich4{margin-left:1.875em;}
	
#ich5{margin-left:2.625em;}

#ich6{margin-left:3em;}

/*---ende ueber mich: geboren,zivilstand,hobby usw---*/

Dann habe ich gleich noch was gemacht, und habe die ID #ich1 dazu gebraucht.
(Achtung die Schuljahre stimmen nicht, es geht nur um die Übung.

<!--Anfang Box-r-schuljahre-->
<div id="box-r">
<h2>Schuljahre</h2>
<p><strong class="schuljahre">08/2003 - 08/2187:</strong> <span class="ich1">Berufsschule, xxx</span></p>
<p><strong class="schuljahre">08/1950 - 08/2001:</strong> <span class="ich1">Berufsschule, xxx</span></p>
<p><strong class="schuljahre">08/1900 - 08/1950:</strong> <span class="ich1">Sekundarschule, xxx</span></p>
<p><strong class="schuljahre">08/1800 - 08/1900:</strong> <span class="ich1">Primarsachule, xxx</span></p>
<p><strong class="schuljahre">08/1800 - 08/1900:</strong> <span class="ich1">Primarschule, xxx</span></p>
</div>
<!--Ende Box-r-schuljahre-->

.schuljahre{
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	}

Sieht so aus:

 

[patrick_l]

AW: Abstand html

Benutze für deinen (tabellarischen) Daten eine Tabelle:

<table id="werdegang">
  <tr>
    <td class="jahr">1995 - 1999</td>
    <td class="schule">Grundschule, xxx</td>
  </tr>
  <tr>
    <td class="jahr">1999 - 2005</td>
    <td class="schule">Realschule, xxx</td>
  </tr>
  <tr>
    <td class="jahr">2005 - 2009</td>
    <td class="schule">Berufsschule, xxx</td>
  </tr>
</table>

Für die Schriftvergabe auch nur ein »Fallback«, eine Ersatzschrift sowie die Angabe ob Schrift mit oder ohne Serifen. Cebito hat es ja schon erwähnt. Tabellen haben ihre Berechtigung. In diesem Fall ein klares ja. Also nutze sie.

Liebe Grüße, Patrick

 

[cebito]

AW: Abstand html

Cebito hat es ja schon erwähnt. Tabellen haben ihre Berechtigung. In diesem Fall ein klares ja. Also nutze sie.

Nö, eben nich. Lieste nochmal - vor allem in dem von mir verlinkten Beitrag

 

[patrick_l]

AW: Abstand html

Nö, eben nich. Lieste nochmal - vor allem in dem von mir verlinkten Beitrag

Autsch, das tut weh. Bin jetzt deinem Link gefolgt, gelesen und hocke nun mit einem deutlichen Kopfschütteln vor meinem Post.