mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 23.07.2019 20:31 Benutzername: Passwort: Auto-Login

Thema: css > spalten ... vom 29.10.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> css > spalten ...
Seite: 1, 2  Weiter
Autor Nachricht
ma1973
Threadersteller

Dabei seit: 17.02.2006
Ort: borken
Alter: 46
Geschlecht: Männlich
Verfasst Mi 29.10.2008 13:46
Titel

css > spalten ...

Antworten mit Zitat Zum Seitenanfang

Hallo

ich versuche mit CSS zu arbeiten ... und weniger mit Tabellen, mmh

so wie bekomme ich es hin, das ich drei gleich spalten habe, in der Höhe und Breite,
Inhalt der Spalten ist immer der selbe, ein Bild text und "marke".

Das soll für mozilla wie auch für IE funktionieren.

so sieht mein css aus:

Code:

..
 /* #col1 becomes the left column | #co11 wird zur linken Spalte */
  #col1 { float:left; width: 100px; margin: 0; padding-right: 40px;}


  /* #col2 becomes the middle column | #col2 wird zur mittleren Spalte */
  #col2 { float:left; width: 100px;   margin: 0px;}


  /* #col3 becomes the right column | #col3 wird zur rechten Spalte */
  #col3 { margin-left: 280px;  margin-right: 0px; }
..


... es verschiebt sich jedesmal was in der Höhe, der IE macht es manchmal
mozilla nicht und manchmal umgekehrt.
  View user's profile Private Nachricht senden
DesignKater

Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Mi 29.10.2008 14:05
Titel

Antworten mit Zitat Zum Seitenanfang

Wenns dreimal das gleiche sein soll schreib doch:

.col{width:100px; height:dein wert; float:left; margin-left:20px;}


Zuletzt bearbeitet von DesignKater am Mi 29.10.2008 14:05, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Anzeige
Anzeige
ma1973
Threadersteller

Dabei seit: 17.02.2006
Ort: borken
Alter: 46
Geschlecht: Männlich
Verfasst Mi 29.10.2008 14:15
Titel

Antworten mit Zitat Zum Seitenanfang

... wenn ich das mache stehen diese untereinander, die sollen aber nebeneinander liegen.
mmmh oder was mache ich verkehrt?!

CSS:

Code:

..
.col{width:100px; height:dein wert; float:left; margin-left:20px;}
..


html:
Code:

..
<!-- 1col -->
 <div id="col">
      <img src="image/test.jpg" width="90" height="110" border="1"><br><br>
   test<br>1?. Jhd.<br>H&ouml;he: ?? cm<p><div id="bold">Limit: ?00 &euro;</div></p>
 </div>

<!-- 2col -->
 <div id="col">
      <img src="image/test.jpg" width="90" height="110" border="1"><br><br>
   test<br>1?. Jhd.<br>H&ouml;he: ?? cm<p><div id="bold">Limit: ?00 &euro;</div></p>
 </div>

<!-- 3col -->
 <div id="col">
      <img src="image/test.jpg" width="90" height="110" border="1"><br><br>
   test<br>1?. Jhd.<br>H&ouml;he: ?? cm<p><div id="bold">Limit: ?00 &euro;</div></p>
 </div>
..
  View user's profile Private Nachricht senden
Zeithase

Dabei seit: 09.05.2005
Ort: Erfurt
Alter: 34
Geschlecht: Männlich
Verfasst Mi 29.10.2008 14:18
Titel

Antworten mit Zitat Zum Seitenanfang

Du solltest Dich dann eher erstmal mit den Grundlagen von CSS/HTML beschaeftigen. CSS4YOU, SelfHTML sollten hier die ersten Anlaufstellen sein. ".col" bedeutet, dass die Klasse "col" definiert wird. Folglich muss es <div class="col">...</div> heißen, nicht id - das ist ein einmaliger Wert.

Ansonsten ist Dein ersterer Code gar nicht mal verkehrt - wenn Du #col3 einfach auch floaten lassen wuerdest und den linken Margin weglaesst.
  View user's profile Private Nachricht senden
DesignKater

Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Mi 29.10.2008 14:24
Titel

Antworten mit Zitat Zum Seitenanfang

Wie mein Vorredner sagte, alle Divs haben die selbe Klasse .col.

HTML:

<div class="col"></div>
<div class="col"></div>
<div class="col"></div>

Und die laufen allen nebeneinander her!

Hier nochmal im ganzen:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
.col{width:100px; height:dein wert; float:left; margin-left:20px;}   
</style>
</head>

<body>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
</body>
</html>


Zuletzt bearbeitet von DesignKater am Mi 29.10.2008 14:25, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
pixelpapst303

Dabei seit: 06.07.2006
Ort: hamburg
Alter: 45
Geschlecht: Männlich
Verfasst Mi 29.10.2008 14:35
Titel

Re: css > spalten ...

Antworten mit Zitat Zum Seitenanfang

ma1973 hat geschrieben:
drei gleich spalten habe, in der Höhe und Breite


sagt noch jemand das zauberwort (in zusammenhang mit dynamischen content), oder muss ich mich einmischen... bün doch krank *Schnief*


Zuletzt bearbeitet von pixelpapst303 am Mi 29.10.2008 14:35, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Zeithase

Dabei seit: 09.05.2005
Ort: Erfurt
Alter: 34
Geschlecht: Männlich
Verfasst Mi 29.10.2008 14:37
Titel

Antworten mit Zitat Zum Seitenanfang

Huch. Kann man ja mal ueberlesen. Bitteschoen.
  View user's profile Private Nachricht senden
ma1973
Threadersteller

Dabei seit: 17.02.2006
Ort: borken
Alter: 46
Geschlecht: Männlich
Verfasst Mi 29.10.2008 14:38
Titel

Antworten mit Zitat Zum Seitenanfang

... danke dir!!!!!!!!!!!!!!! super:-)



DesignKater hat geschrieben:
Wie mein Vorredner sagte, alle Divs haben die selbe Klasse .col.

HTML:

<div class="col"></div>
<div class="col"></div>
<div class="col"></div>

Und die laufen allen nebeneinander her!

Hier nochmal im ganzen:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
.col{width:100px; height:dein wert; float:left; margin-left:20px;}   
</style>
</head>

<body>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
</body>
</html>
  View user's profile Private Nachricht senden
 
Ähnliche Themen css 3 spalten nebeneinander
css > spalten > mittig ...
CSS mit 3 Spalten klappt nicht :-(
CSS - Text in Spalten
css > 4 gleiche spalten ...
[css] 3 spalten layout problem
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.