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

2pic in einer tabelle

S

Sakura♥

Neues Mitglied
Huhu =)

scheint so als würdet ihr mich nicht los bekommen ;P
ein Problem nach dem anderen Folgt >,> regt mich auch auf!
naja ich hoff ihr helft mir trotdem noch gerne ^^

...also, das einzigste problem das ich jetzt hab ist, dass ich die bilder in der Tabelle in eine Reihe bekommen will. Ich probier jetzt schon seit zwei stunde rum aber i-wie wills net funktionieren. *ferzweifelt bin*
Es ist Ja nur eine Tabelle mit zwei Spalten, normalerweise sollten sie nebeneinander sein, oder? Ich denke das 100% was am CSS code falsch ist.
ich hoffe ihr könnt mir findet den fehler. Ich strenge mich auch an ihn noch zu finden! >3

hier:
HTML: 
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>
 <head>
   <title>AnimeMangaStyle | Anime/Manga</title>
   <link rel="stylesheet" type="text/css" href="style/layout.css" />
   <link rel="stylesheet" type="text/css" href="style/anime und manga.css" />
 </head>
 <body>
  <div id="Content">
<h1><img src="Style/Header1.jpg" alt="AnimeManga Style" /></h1>
     <ul>
  <li>Home</li>
  <li>Anime/Manga</li>
  <li>Japan</li>
  <li>Forum</li>
  <li>Login/Register</li>
</ul>
<h2>Anime und Manga</h2>
<p>Hier könnt ihr Animes anschauen oder Mangas lesen.
       Es gibt viel auswahl und euch wird nicht langweilig werden.
       Jeder  kann hier Animes oder Mangas hochladen, die noch nicht
       vorhanden sind. Falls ihr irgendwelche Animes oder Mangas findet die 
       nicht Funktionieren, klickt bitte auf den "Report" -Button.
       Wir hoffen, dass ihr unsere Seite weiterhin besuchen kommt.</p>
<p>Viel Spaß noch!</p>
<tr>
 <td>
       <ul>
  <li id="list">#</li>
  <li id="list">A</li>
  <li id="list">B</li> 
  <li id="list">C</li>
  <li id="list">D</li>
  <li id="list">E</li>
  <li id="list">F</li>
  <li id="list">G</li>
  <li id="list">H</li> 
  <li id="list">I</li>
  <li id="list">J</li>
  <li id="list">K</li>
  <li id="list">L</li>
  <li id="list">M</li>
  <li id="list">N</li> 
  <li id="list">O</li>
  <li id="list">P</li>
  <li id="list">Q</li>
  <li id="list">R</li>
  <li id="list">S</li>
  <li id="list">T</li> 
  <li id="list">U</li>
  <li id="list">V</li>
  <li id="list">W</li>
  <li id="list">X</li>
  <li id="list">Y</li>
  <li id="list">Z</li> 
 </ul>
<img src="Style/watch_anime.jpg" alt="Watch Anime" />
</td>
<td>
      <ul>
  <li id="list">#</li>
  <li id="list">A</li>
  <li id="list">B</li> 
  <li id="list">C</li>
  <li id="list">D</li>
  <li id="list">E</li>
  <li id="list">F</li>
  <li id="list">G</li>
  <li id="list">H</li> 
  <li id="list">I</li>
  <li id="list">J</li>
  <li id="list">K</li>
  <li id="list">L</li>
  <li id="list">M</li>
  <li id="list">N</li> 
  <li id="list">O</li>
  <li id="list">P</li>
  <li id="list">Q</li>
  <li id="list">R</li>
  <li id="list">S</li>
  <li id="list">T</li> 
  <li id="list">U</li>
  <li id="list">V</li>
  <li id="list">W</li>
  <li id="list">X</li>
  <li id="list">Y</li>
  <li id="list">Z</li> 
 </ul>
<img src="Style/read_manga.jpg" alt="Read Manga" />
</td>
</tr>
</div>
</body>
</html>
Code: 
li#list
{
  display:inline;
  padding-right: 1px;
  margin: 15px 5px 15px 5px;
}
Das is das einzigste was ich bisher in CSS eingegben hab.

hier noch den vom layout:

Code: 
body
{
  background: #353A55;
}

div#Content 
{
  width: 60%;
  margin:0 auto;
  background: #434D67;
  font-family: arial, verdana, sans-serif;
  border: 5px double #2B2427;
}

h1
{
 background-image: url("Style/Header1.jpg");
 padding: 0px 70px; 0px 70px;
}

li
{
  display:inline;
  padding-right: 70px;
}

ul
{
  background: #61636F;
  padding-top: 2px;
  padding-bottom: 2px;
}

h2
{
  padding-top: 15px;
  padding-left: 5px;
  margin-bottom: 10px;
}

p
{
  padding-left: 5px;
  font-size: 14px;
  margin-right: 150px;
}



THX
lg
Sakura♥
 
Werbung:
Tabellen sind nicht für das Layout gedacht, ausserdem fängt deine Tabelle mit <tr> an, da würde <table> fehlen, aber da sie hier ja eh falsch ist, kannst du das auch löschen.
 
Werbung:
tschuldigung aber die Liste <li> ist im <tr> drin xDD
aber danke für den hinweiß das ich <table> vergessen hab^^

lg
Sakura♥
 
Nein, das Table willst Du doch gar nicht, oder hast Du hier tabellarische Daten? Ich sehe keine.

Ich habe beim Überfliegen aber auch gesehen, dass mehrere Elemente die selbe ID haben. Eine ID muss aber im Dokumet eindeutig sein!
 
Werbung:
ne Tabelle wollte ich schon. Es hat auch geklappt.
ich hab alle mitdem selben div gekennzeichnet weil die alle gleichen abstand etc. haben sollten. eigendlich is das ganze Ergebnis auch so wie ich wollte.

Jeder <li> bekommt nachher noch einen link zu dem Jeweiligen Manga bzw Anime.

HTML: 
<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>
 <head>
   <title>AnimeMangaStyle | Anime/Manga</title>
   <link rel="stylesheet" type="text/css" href="style/layout.css" />
   <link rel="stylesheet" type="text/css" href="style/anime und manga.css"
/>
 </head>
 <body>
  <div id="Content">
<h1><img src="Style/Header1.jpg" alt="AnimeManga Style" /></h1>
     <ul>
  <li>Home</li>
  <li>Anime/Manga</li>
  <li>Japan</li>
  <li>Forum</li>
  <li>Login/Register</li>
</ul>
<h2>Anime und Manga</h2>
<p>Hier könnt ihr Animes anschauen oder Mangas lesen.
       Es gibt viel auswahl und euch wird nicht langweilig werden.
       Jeder  kann hier Animes oder Mangas hochladen, die noch nicht
       vorhanden sind. Falls ihr irgendwelche Animes oder Mangas findet die 
       nicht Funktionieren, klickt bitte auf den "Report" -Button.
       Wir hoffen, dass ihr unsere Seite weiterhin besuchen kommt.</p>
<p>Viel Spaß noch!</p>
<table>
<tr>
 <td>
       <ul>
  <li id="list">#</li>
  <li id="list">A</li>
  <li id="list">B</li> 
  <li id="list">C</li>
  <li id="list">D</li>
  <li id="list">E</li>
  <li id="list">F</li>
  <li id="list">G</li>
  <li id="list">H</li> 
  <li id="list">I</li>
  <li id="list">J</li>
  <li id="list">K</li>
  <li id="list">L</li>
  <li id="list">M</li>
  <li id="list">N</li> 
  <li id="list">O</li>
  <li id="list">P</li>
  <li id="list">Q</li>
  <li id="list">R</li>
  <li id="list">S</li>
  <li id="list">T</li> 
  <li id="list">U</li>
  <li id="list">V</li>
  <li id="list">W</li>
  <li id="list">X</li>
  <li id="list">Y</li>
  <li id="list">Z</li> 
 </ul>
<h3><img src="Style/watch_anime.jpg" alt="Watch Anime" /></h3>
</td>
<td>
      <ul>
  <li id="list">#</li>
  <li id="list">A</li>
  <li id="list">B</li> 
  <li id="list">C</li>
  <li id="list">D</li>
  <li id="list">E</li>
  <li id="list">F</li>
  <li id="list">G</li>
  <li id="list">H</li> 
  <li id="list">I</li>
  <li id="list">J</li>
  <li id="list">K</li>
  <li id="list">L</li>
  <li id="list">M</li>
  <li id="list">N</li> 
  <li id="list">O</li>
  <li id="list">P</li>
  <li id="list">Q</li>
  <li id="list">R</li>
  <li id="list">S</li>
  <li id="list">T</li> 
  <li id="list">U</li>
  <li id="list">V</li>
  <li id="list">W</li>
  <li id="list">X</li>
  <li id="list">Y</li>
  <li id="list">Z</li> 
 </ul>
<h3><img src="Style/read_manga.jpg" alt="Read Manga" /></h3>
</td>
</tr>
</table>
</div>
</body>
</html>

Code: 
li#list
{
  display:inline;
  padding-right: 1px;
  margin: 15px 5px 15px 5px;
}

table
{
  border: 3px solid #2B2427;
  margin: 15px 10px 10px 10px;
}

td
{
  padding: 5px 5px 5px 5px;
  margin: 0 auto;
}

h3
{
  padding: 5px 10px 5px 40px;
}

......?

lg
Sakura♥
 

Anhänge

  • watch_anime.jpg
    watch_anime.jpg
    56,1 KB · Aufrufe: 5
  • read_manga.jpg
    read_manga.jpg
    56,7 KB · Aufrufe: 3
Sakura♥ schrieb:
ne Tabelle wollte ich schon.
Zum Vergrößern anklicken....
Wo hast Du denn tabellarische Daten?

Es hat auch geklappt.
Zum Vergrößern anklicken....
Das ist sehr kurzsichtig, sowas zu behaupten, wenn man nur eine handvoll eigene Browser hat.

ich hab alle mitdem selben div gekennzeichnet
Zum Vergrößern anklicken....
Eigentlich meine ich die <li>. Listenelemente werden nicht mit <div> ausgezeichnet.

weil die alle gleichen abstand etc. haben sollten.
Zum Vergrößern anklicken....
Deswegen darf eine ID trotzdem nur einmal vorkommen! Du willst statt ID eher "class" benutzen. Aber noch einfacher wäre es, die Klasse der Liste zuzuweisen, weil Du dann mit diesem Selektor alle einzelnen Listenpunkte ansprechen kannst:
Code: 
ul.bla li
Das spricht alle <li>, die innerhalb einer <ul> mit der Klasse "bla" stehen, an.

eigendlich is das ganze Ergebnis auch so wie ich wollte.
Zum Vergrößern anklicken....
Syntaktisch voller Fehler und semantisch sinnfrei?
 
das mit ul stimmt schon XDD
wollte ich nämlich zuerstmachen dachte dann aber nee....
ich werds ändern!!
Danke^^

Syntaktisch voller Fehler und semantisch sinnfrei?
Zum Vergrößern anklicken....
was meinst du damit? Ist es wirklich so schlimm? Kann doch nicht sein das ich schon wieder so viele Fehler reingebaut hab T,T ....
zu antwort: ne eig. nicht. Ich meine wenn ich das ergebnis im browser anschau sieht es so aus wie ich es wollte, und ich hab mir mühe gegeben das es richtig wird.


......
lg
Sakura♥
 
Werbung:
Na, das syntaktische hast Du ja inzwischen verbessert.

Eine Liste als Tabelle auszuzeichnen ist nunmal semantisch sinnfrei.

Sakura♥ schrieb:
Ich meine wenn ich das ergebnis im browser anschau sieht es so aus wie ich es wollte, und ich hab mir mühe gegeben das es richtig wird.
Zum Vergrößern anklicken....
Das ist Dein Fehler (den machen leider viele andere auch).

Zumindest was die Auszeichnung in HTML angeht, ist die Darstellung im Browser irrelevant!
Es kommt bei HTML nicht darauf an, wie es dargestellt wird. HTML ist nicht für die Darstellung!

Ja, es ist wirklich so einfach - Trennung von Inhalt und Layout - in jeder Hinsicht! Die Fronten sind ganz klar gesteckt. Jeder Übertritt auf feindliches Gebiet macht die Thematik komplizierter und unlogisch. Wenn Du Dich bei HTML wirklich auf die Semantik beschränkst und das Aussehen völlig außen vor lässt, dann erst wird das Thema "Semantik" sonnenklar und HTML eine völlig logische und ganz, ganz simple Sache!
 
mein Ziel war es diese Liste in eine box/tabelle zu bringen kanns i-wie nicht richtig erklären ><

hätte ich jetzt z.B einfach die tabelle weglassen und statt dessen,
den rest mit css machen sollen bzw. (einen border um die liste)?
Dann wäre es doch eig. das selbe ergebniss und ich würde die tabelle nicht benutzen. stimmt es so?


Zumindest was die Auszeichnung in HTML angeht, ist die Darstellung im Browser irrelevant!
Es kommt bei HTML nicht darauf an, wie es dargestellt wird. HTML ist nicht für die Darstellung!
Zum Vergrößern anklicken....
Werd ich mir merken und mich auf die "Semantik" konzentrieren^^

*Efchen knuddel*
lg
Sakura♥
 
Sakura♥ schrieb:
hätte ich jetzt z.B einfach die tabelle weglassen und statt dessen,
den rest mit css machen sollen bzw. (einen border um die liste)?
Dann wäre es doch eig. das selbe ergebniss
Zum Vergrößern anklicken....
Nö, das eine ist HTML, das andere ist CSS. Das eine legt die Bedeutung des Inhalts fest, das andere nur das Aussehen. Das sind zwei unterschiedliche Dinge wie Nashorn und Elefant.
 
Werbung:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben