| Autor |
Nachricht |
ma1973
Threadersteller
Dabei seit: 17.02.2006
Ort: borken
Alter: 51
Geschlecht: 
|
Verfasst Mi 29.10.2008 13:46
Titel css > spalten ... |
  |
|
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.
|
|
| |
  |
 |
DesignKater
Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 29.10.2008 14:05
Titel
|
|
|
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
|
|
| |
|
|
|
Anzeige
|
|
|
ma1973
Threadersteller
Dabei seit: 17.02.2006
Ort: borken
Alter: 51
Geschlecht:
|
Verfasst Mi 29.10.2008 14:15
Titel
|
|
|
... 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öhe: ?? cm<p><div id="bold">Limit: ?00 €</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öhe: ?? cm<p><div id="bold">Limit: ?00 €</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öhe: ?? cm<p><div id="bold">Limit: ?00 €</div></p>
</div>
..
|
|
|
| |
|
|
Zeithase
Dabei seit: 09.05.2005
Ort: Erfurt
Alter: 39
Geschlecht:
|
Verfasst Mi 29.10.2008 14:18
Titel
|
|
|
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.
|
|
| |
|
|
DesignKater
Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 29.10.2008 14:24
Titel
|
|
|
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
|
|
| |
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Mi 29.10.2008 14:35
Titel Re: css > spalten ... |
|
|
| 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 
Zuletzt bearbeitet von pixelpapst303 am Mi 29.10.2008 14:35, insgesamt 1-mal bearbeitet
|
|
| |
 |
|
Zeithase
Dabei seit: 09.05.2005
Ort: Erfurt
Alter: 39
Geschlecht:
|
Verfasst Mi 29.10.2008 14:37
Titel
|
|
|
|
Huch. Kann man ja mal ueberlesen. Bitteschoen.
|
|
| |
|
|
ma1973
Threadersteller
Dabei seit: 17.02.2006
Ort: borken
Alter: 51
Geschlecht:
|
Verfasst Mi 29.10.2008 14:38
Titel
|
|
|
... 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>
|
|
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
css 3 spalten nebeneinander
CSS - Text in Spalten
css > 4 gleiche spalten ...
css > spalten > mittig ...
Indesign CC PDF Interaktiv mit Spalten?
(CSS) Spalten gleich hoch
|
|
Willkommen auf dem Portal für Mediengestalter
