| Autor |
Nachricht |
FeeBaa
Threadersteller
Dabei seit: 04.02.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 30.04.2008 15:38
Titel CSS Woerter nebeneinander |
  |
|
Hi Foris,
ich schlage mich immernoch mit CSS herum. Mein Skript:
<html>
<head>
<style type="text/css">
div#main_container:{width=900;font:Arial;color:white;padding:5px;}
div#top{width:797px; margin-bottom:5px;padding-right:50px;}
</style>
</head>
<body>
<div id="main_container">
<!-- main menu -->
<div id="top"><div>Home</div><div>Wer wir sind</div><div>Warengruppen</div><div>Dienstleistungen</div>
</div><!-- mach top zu -->
</div><!-- mach main_container zu -->
</body>
</html>
Im Body moechte ich die Woerter so in den Topcontainer setzen, dass diese nebeneinander mit einem Abstand von 50px stehen. Daher hab ich sie nochmal in div tags reingesetzt.
Nun hab ich das Problem, dass weder der Font nach Arial aussieht, noch die Woerter nebeneinander stehen.
Kann mir jemand bitte helfen?
Danke
FeeBaa
|
|
| |
  |
 |
choise
Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 35
Geschlecht: 
|
Verfasst Mi 30.04.2008 15:42
Titel
|
|
|
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaahhhhhhh
lies dir mal n paar tuts über menüs mit undefinierten listen durch,..
also die listen per css so anpassen, dass es wie das gewollte aussieht,
hier mal so n kleiner hinweis
| Code: |
<ul>
<li><a href="#l">01</a></li>
<li><a href="#l">02</a></li>
<li><a href="#l">03</a></li>
<li><a href="#l">04</a></li>
</ul>
|
das ganze dann noch mit css formatieren usw,.. google mal / board suche, da gibts ne menge
Zuletzt bearbeitet von choise am Mi 30.04.2008 15:44, insgesamt 1-mal bearbeitet
|
|
| |
 |
|
|
Anzeige
|
|
|
Mac
Dabei seit: 26.08.2005
Ort: Köln
Alter: 62
Geschlecht:
|
|
| |
|
|
FeeBaa
Threadersteller
Dabei seit: 04.02.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 30.04.2008 16:11
Titel
|
|
|
Prima, die Ausrichtung klappt.
Wo liegt nun mein Fehler was die Schrift betrifft? Ich dachte die Definition im main container beeinflusst alle Textinhalte. Das scheint aber nicht so zu sein.
Danke
FeeBaa
|
|
| |
|
|
Mac
Dabei seit: 26.08.2005
Ort: Köln
Alter: 62
Geschlecht:
|
Verfasst Mi 30.04.2008 17:02
Titel
|
|
|
du hast für div#top eien rechten RAnd angegeben. Das Gild für das DIV selber.
du müsstest dann schon sowas wie
| Code: |
..
.rechter_rand: padding-right:50px;
..
<div class="rechter_Rand">Home</div>
|
benennen.
Das ist aber viel zu umständlich und führt eigentlich zur gefürchteten Divitiis.
|
|
| |
|
|
FeeBaa
Threadersteller
Dabei seit: 04.02.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 30.04.2008 17:32
Titel
|
|
|
Hi Mac,
das verstehe ich grade nicht, padding ist doch die Innenbegrenzung und so wie ich margin verstanden habe, waere das die Definition vom Rand des Containers nach aussen hin.
Wenn ich Tabellen so eingestellt hab, hat das auf jeden Fall geklappt.
Padding klappt auch bei der neuen Variante, die ich m.H. von choise's Beitrag gemacht habe:
ul#top li{width:797px; margin-bottom:5px;padding-right:50px;display:inline;}
<ul id="top">
<li>Home</li>
<li>Ueber uns</li>
<li>Warengruppen</li>
<li>Kontakt</li>
</ul>
Ich scheine bloss was mit den Containern falsch gemacht zu haben, weil offenbar der Main-container ueberschrieben wird vom top-container, der ja keine font-definition hat so dass dann meine Schrift nicht in Arial dastehen. Kannst du mir da vielleicht weiterhelfen? Ich find den Fehler nicht 
FeeBaa
|
|
| |
|
|
Mac
Dabei seit: 26.08.2005
Ort: Köln
Alter: 62
Geschlecht:
|
Verfasst Mi 30.04.2008 18:13
Titel
|
|
|
Das DIV von <div>Home</div> etc. hat aber doch keine Eigenschaften?
Im Beispiel der unsortet list wird das <ul> und <li> definiert.
|
|
| |
|
|
rob
Dabei seit: 11.12.2003
Ort: ~/
Alter: 46
Geschlecht:
|
Verfasst Mi 30.04.2008 22:59
Titel
|
|
|
Da ist kein Script. Weder bei HTML noch bei CSS handelt es sich um eine Scriptsprache bzw. um Scripte.
Deine HTML-Seite sollte mit einer Dokumenttypdeklaration beginnen - zumindest wenn du korrekten Code schreiben willst.
Außerdem sollen die Browser ja wohl auch wissen, welche HTML-Fassung vorliegt, welche Tags, Attribute, Entitäten, ... zulässig sind, usw.. Auch der Doctype-Switch ist wichtig.
Siehe: Grundgerüst einer HTML-Datei
Das sollte in etwa folgendermaßen aussehen:
| Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> |
| Code: | | div#main_container:{width=900;font:Arial;color:white;padding:5px;} |
Was macht der Doppelpunkt hinter container?
In CSS werden den Eigenschaften keine Werte mit Gleichheitszeichen, sondern mit Doppelpunkt zugewiesen.
Breitenangaben sollten eine Einheit haben.
Du solltest immer eine generische Schriftfamilie als Alternative angeben. Die Eigenschaft zur Schriftwahl heißt außerdem font-family und nicht font. Das ist eine Kurzform um mehrere Schriftformatierungen zu kombinieren. Dabei werden aber alle anderen Schriftformatierungen erstmal wieder auf Default gesetzt. In diesem Fall spielt das wohl keine Rolle, aber ich würde raten, alle Fontangaben einzeln zu setzen, wenn du dir nicht ganz sicher bist, was du da tust.
Bei Farbangaben würde ich hexadezimale RGB-Angaben machen. Ist aber nicht falsch, was du gemacht hast. white gehört zu einer der 16 vordefinierten Farbangaben.
| Code: | div#main_container {
width: 900px;
font-family: Arial, sans-serif;
color: #ffffff;
padding:5px;
} |
Es gibt kein title-Element innerhalb deines heads. Das Element darf nicht weggelassen werden. Du kannst es leer lassen, darfst es aber nicht weglassen, wenn du korrekten Code schreiben willst.
Und weil recht offensichtlich einiges an Grundlagen fehlt, empfehle ich dir, mal einen Blick in SelfHTML im Allgemeinen bzw. in den CSS-Teil im Speziellen zu werfen.
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
DIV nebeneinander
[CSS] 4 DIVS nebeneinander
IE 7 Liste nebeneinander
2 div-bereiche nebeneinander...
div nebeneinander positionieren
2 Überschriften nebeneinander?
|
|
Willkommen auf dem Portal für Mediengestalter
