Willkommen auf dem Portal für Mediengestalter
|
|
Autor |
Nachricht |
Smooth-Graphics
Threadersteller
Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst So 04.05.2008 08:59
Titel [CSS] <div> nimmt Formatierung nicht an? |
|
|
Hey ihr,
ich hab grade ein Problem... und zwar nimmt ein <div> Container meine CSS Formatierung (margin und padding) nicht per id an:
Code: |
<div id="submenu">
<span class="subnavigation"><a href="#" class="subnavigation">Submenu</a></span>
<span class="subnavigation"><a href="#" class="subnavigation">Submenu</a></span>
<span class="subnavigation"><a href="#" class="subnavigation">Submenu</a></span>
<span class="subnavigation"><a href="#" class="subnavigation">Submenu</a></span>
</div>
|
CSS:
Code: |
div#submenu {
margin: 10px 80px 0 0;
}
.subnavigation {
padding-left: 2px;
padding-right: 2px;
} |
div#submenu nimmt er nicht an, die Klasse .subnavigation jedoch schon.
Hilfe?
Danke, Gruß Smooth
|
|
|
|
|
heiko_rs
Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht:
|
Verfasst So 04.05.2008 09:17
Titel
|
|
|
Der von Dir gepostete Code funktioniert einwandfrei. Wenn's bei Dir nicht läuft, gibt's in Deinem CSS wahrscheinlich noch weitere Regeln mit höherer Spezifität.
Abgesehen davon, dass ein Menü in eine Liste gehört - div wird zu ul und span zu li.
Zuletzt bearbeitet von heiko_rs am So 04.05.2008 09:19, insgesamt 1-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
Account gelöscht
Ort: -
Alter: -
|
Verfasst So 04.05.2008 09:24
Titel
|
|
|
Also erstmal frag ich mich, wenn das eine Navigation ist, warum dann DIV und SPAN statt einer Liste.
Aber zu deinem Problem:
poste mal den gesamten Code, so ohne Zusammenhänge kann man nur die Syntax beurteilen, die ist ok, wenn auch nicht schön, und mit einem Span dessen Sinn ich nicht verstehe. Aber durch Vererbung, Tippfehler im Code etc. kann sowas ja völlig anders aussehen
edit: zu langsam
aber probier einfach mal
Code: | div#submenu {
margin: 10px 80px 0 0 !important;
}
|
und schau ob sich was tut.
Zuletzt bearbeitet von am So 04.05.2008 09:28, insgesamt 1-mal bearbeitet
|
|
|
|
|
Smooth-Graphics
Threadersteller
Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst So 04.05.2008 09:53
Titel
|
|
|
Okay, dann hier das ganze:
HTML:
Code: |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" media="screen, projection" type="text/css" href="layout.css" />
<link rel="stylesheet" media="screen, projection" type="text/css" href="style.css" />
</head>
<body>
<div id="all">
<div id="menu">
<?php
foreach ( $menu as $point => $value) {
echo "<span class=\"navigation\"><a href=\"$value\" class=\"navigation\">$point</a></span>";
}
?>
</div>
<!-- sub navigation -->
<ul id="submenu">
<?php
if(strip_tags($_GET['id'])=='portfolio'){
foreach ( $submenu as $point2 => $value2) {
echo "<li class=\"subnavigation\"><a href=\"$value2\">$point2</a></li>";
}
}
?>
</ul>
</div>
</body>
</html>
|
CSS:
Code: |
@charset "UTF-8";
/* CSS Document */
/* Start CSS RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
/* End of CSS reset */
div#all {
width: 900px;
height: auto;
margin-left: 15px;
margin-top: 35px;
}
#header {
width: 820px;
height: 50px;
}
div#menu {
width: 900px;
height: auto;
margin-left: -10px;
}
.navigation {
padding-left: 5px;
padding-right: 5px;
}
#submenu ul{
float: left;
margin-left: 80px;
padding-left: 80px;
list-style-type: none;
}
.subnavigation li {
float: left;
padding-left: 2px;
padding-right: 2px;
}
div#content1 {
float: left;
width: 900px;
height: 425px;
padding-top: 25px;
}
div#rightcontent {
float: right;
width: 400px;
height: 400px;
}
div#leftcontent {
float: left;
width: 400px;
height: 400px;
overflow: hidden;
/* border: #333333 thin solid; */
}
div#footer {
clear: both;
margin-left: -10px;
}
.footertext {
padding-left: 5px;
padding-right: 5px;
}
|
Oder hier als ganzes mit Ausgabe: klick
Ach ja: die Liste sollte eigentlich nebeneinander sein, das funktioniert aber auch nicht
Zuletzt bearbeitet von Smooth-Graphics am Fr 22.10.2010 06:56, insgesamt 3-mal bearbeitet
|
|
|
|
|
heiko_rs
Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht:
|
Verfasst So 04.05.2008 10:33
Titel
|
|
|
Du hast ein Müllzeichen im CSS
Und Du speicherst Dein CSS als utf-8, lieferst es aber nicht als solches aus.
|
|
|
|
|
Smooth-Graphics
Threadersteller
Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst So 04.05.2008 10:40
Titel
|
|
|
Das Müllzeichen hab ich nirgendwo gefunden... und auch ohne UTF-8, bzw mit UTF-8 Ausgabe, es geht immer noch nicht.
Ich hab das ganze jetzt anders gelöft, nur die <li> Elemente bleiben trotz Versuche mit display:inline oder float:left untereinander angeordnet.
//EDIT:
Die <li> Elemente werden nun auch nebeneinander angezeigt, nachdem ich statt
Code: | #submenu ul{
}
#submenu li{
} |
Code: | li { ... }
ul { ... }
|
geschrieben habe. Was ist denn daran falsch gewesen?
Zuletzt bearbeitet von Smooth-Graphics am So 04.05.2008 10:49, insgesamt 1-mal bearbeitet
|
|
|
|
|
heiko_rs
Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht:
|
Verfasst So 04.05.2008 10:54
Titel
|
|
|
Smooth-Graphics hat geschrieben: | Das Müllzeichen hab ich nirgendwo gefunden |
Es wurde auch nur in iso sichtbar (was im Prinzip jeder Browser bei CSS per default macht, wenn keine andere Zeichencodierung gesendet wird, z.B. per .htaccess).
Smooth-Graphics hat geschrieben: | Die <li> Elemente werden nun auch nebeneinander angezeigt, nachdem ich statt
Code: | #submenu ul{
}
#submenu li{
} |
Code: | li { ... }
ul { ... }
|
geschrieben habe. Was ist denn daran falsch gewesen? |
Wie gesagt, das Müllzeichen war schuld. Schreibe den vorigen Selektor nochmal per Hand rein, dann wird es gehen (da kein Müllzeichen mehr). Allerdings nur bei li, ul dagegen ist ja #submenu.
Zuletzt bearbeitet von heiko_rs am So 04.05.2008 10:59, insgesamt 3-mal bearbeitet
|
|
|
|
|
Smooth-Graphics
Threadersteller
Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst So 04.05.2008 11:08
Titel
|
|
|
heiko_rs hat geschrieben: | Wie gesagt, das Müllzeichen war schuld. Schreibe den vorigen Selektor nochmal per Hand rein, dann wird es gehen (da kein Müllzeichen mehr). Allerdings nur bei li, ul dagegen ist ja #submenu. |
Okay, danke, jetzt funktionierts so wie ichs haben will... Danke dir!!!
|
|
|
|
|
|
|
|
Ähnliche Themen |
Safari nimmt Schriftfarbe nicht an
Screenerstellung :: Was fürn Prog nimmt ihr?
PS Webgalerie nimmt nicht alle Titel ...
Datenbank nimmt keine Einträge mehr an...
[Illu CS] platziertes .psd nimmt keinen Schlagschatten an!
CSS-Formatierung
|
|
|
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.
|
|