Die Idee war gut, nur wusste ich bis dato nicht wie ich das am besten umsetzen sollte.
Meine Lösung sieht nun wie folgt aus:
#content_main noscript p:first-letter {
font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
font-size: 1em;
color: red;
}
noscript p {
text-align: center;
border: 1px solid red;
background-color: #ccc;
color: red;
}Vielen Dank für Deinen Ratschlag
MfG
mephisto2k
Hallo,
ich möchte auf meiner HP einen Text anzeigen wenn der Benutzer JS für die Seite deaktiviert hat.
Ich habe auszugsweise in der CSS Datei folgende Anweisungen stehen
#content_main p:first-letter {
font-family: "Helvetica Neue", Helvetica, Tahoma, sans-serif;
font-size: 1.3em;
font-weight: 200;
color: #999;
line-height: 1;
}
noscript p {
text-align: center;
border: 1px solid red;
background-color: #ccc;
color: red;
}Der HTML Code sieht wie folgt aus
<noscript><p>Bitte JavaScript für Galerieansicht aktivieren</p></noscript>Dieser Text befindet sich allerdings im "#content_main" Bereich.
Was zur Folge hat das der erste Buchstabe des Noscript-Textes ebenfalls anders als der Rest dargestellt wird. Das wird jetzt mit der CSS Spezifität zu tun haben, allerdings habe ich keine Idee wie ich dem Noscript-Bereich jetzt begreiflich machen soll das "first-letter" nicht für den Noscript-Tag gelten soll.
mit deaktiviertem JS kann man sich HIER die ganze miesere anschauen...
Hat da jemand eine Idee wie ich "first-letter" aus dem Noscript-Tag bekomme?
MfG
mephisto2k
Okay jetzt bin ich verwirrt. Beide Methoden funktionieren, das ist ja schon mal gut aber was ist jetzt der semantisch bessere Weg.
Die Verwendung von Klassen oder die von verschachtelten Tabellen?
MfG
mephisto2k
Genau das mache ich ja.
Die CSS Datei für den IE6 habe ich über Conditional Comments eingebunden. Das funktioniert ja auch.
Ich habe ja beispielsweise in dem IE6 CSS File das Hintergrundbild für den Navigationsbereich entfernt.
Aber ich weiß nicht was ich zum im Beitrag #4 dieses Themas in die IE6 CSS Datei eintragen muss, bzw. nach welchen Stichworten ich suchen könnte.
MfG
mephisto2k
Hallo,
die Fehlerbeseitigung war eine einfache aber geniale Idee. Jetzt ist die Seite zumindest benutzbar.
Das PNG Hintergrundbild bei der Navigation habe ich jetzt für die IE6 Version entfernt. Da der AlphaImageLoader mit der PNG Grafik die Links überlagert und diese nicht mehr anklickbar sind. Google spuckt zwar jede menge zu dem Thema aus aber nichts was mir irgendwo geholfen hat. Mit der derzeitigen Lösung bin ich aber auch ganz zufrieden. JS wollte ich wenn möglich gar nicht auf der Seite implementieren. Auch wenn ich jetzt schon die Shadowbox in den Galerien eingebunden habe...
Nur eine Sache stört mich noch und hier finde ich keine Lösung. Schaut man sich beispielsweise diese Seite mit dem IE6 an so fällt im Vergleicht mit einem aktuellen Browser auf das die Position der Überschriften erstens nicht ganz korrekt ist und zweitens scheint es so als sei der Hintergrund, der Überschrift, abgeschnitten.
Was muss ich an dieser Stelle tun um dem IE6 meine Wünsche kund zu tun?
MfG
mephisto2k
Dachte ich mir schon fast. Gut habe jetzt alles angepasst.
Vielen Dank.
MfG
mephisto2k
DANKE 
kein Wunder das das online nicht ging. Wenn ich mit der alten CSS-Datei arbeite, kann das auch nicht funktionieren.
Welche Methode ist denn üblicher oder besser geeignet, die aus meinem ersten Beitrag oder die aus Nr. 4???
MfG
mephisto2k
Interessant - offline funktioniert es.
Online offenbar nicht.
Hatte vorher die Liste anders gestaltet
<ul>
<li><a href="#" accesskey="s">.home</a></li>
<li><a href="#" accesskey="p">.fotografie</a></li>
<li>
<ul id="navi_shift">
<li class="navi_shift"><a href="#" accesskey="f" id="current">.festival</a></li>
<li class="navi_shift"><a href="#" accesskey="s">.shooting</a></li>
<li class="navi_shift"><a href="#" accesskey="a">.foto.art</a></li>
</ul>
</li>
<li><a href="#" accesskey="l">.links</a></li>
<li><a href="#" accesskey="k">.kontakt</a></li>
<li><a href="#" accesskey="i">.impressum</a></li>
</ul>komisch
Hallo,
ich habe folgenden Code
html
<ul>
<li><a href="#" accesskey="s">.home</a></li>
<li><a href="#" accesskey="p">.fotografie</a></li>
<li class="navi_shift"><a href="#" accesskey="f" id="current">.festival</a></li>
<li class="navi_shift"><a href="#" accesskey="s">.shooting</a></li>
<li class="navi_shift"><a href="#" accesskey="a">.foto.art</a></li>
<li><a href="#" accesskey="l">.links</a></li>
<li><a href="#" accesskey="k">.kontakt</a></li>
<li><a href="#" accesskey="i">.impressum</a></li>
</ul>css
#navi ul {
padding: 40px 5px 20px 20px; /*top right bottom left*/
/*z-index: 1;*/
}
.navi_shift {
padding: 0px 10px 0px 5px; /*top right bottom left*/
margin-left: 20px;
}Mein Problem oder meine Frage bezieht sich nun auf den "navi_shift" Teil. Der Firefox rückt die definierten Klassen korrekt ein. Nicht jedoch der IE6.
Wo liegt hier mein Fehler? Oder was muss ich machen damit der IE6 die definierten Klassen einrückt?
MfG
mephisto2k
Vielen vielen Dank
ich habe den HTML Quellcode jetzt wie folgt geändert
<div id="content_list" >
<ul>
<li class="no_bg"><h4>Tag 1 - Samstag, 24 Juli 2010</h4></li>
</ul>
<ul class="content_wrapper">
<li><a href="zin_amphi_2010.html">ZIN (Gewinner New Talents)</a></li>
<li><a href="din_a_tod_amphi_2010.html">DIN [A] TOD</a></li>
<li><a href="endofgreen_amphi_2010.html">End of Green</a></li>
<li><a href="ashb_heights_amphi_2010.html">Ashbury Heights</a></li>
<li><a href="welle_erdball_amphi_2010.html">Welle:Erdball</a></li>
<li><a href="blutengel_amphi_2010.html">Blutengel</a></li>
<li><a href="anne_clark_amphi_2010.html">Anne Clark</a></li>
<li><a href="and_one_amphi_2010.html">And One</a></li>
<li><a href="impressionen01_amphi_2010.html">- Impressionen -</a></li>
</ul>
</div>Und die CSS Zeile sieht wie folgt aus
#content_list li.no_bg {
background-color: transparent;
}Die 'h4' ergänzung habe ich entfernt da ich nicht den Hintergrund der Überschrift wegnehmen wollte sondern den der des Listeneintrages, bzw. den Hintergrund der Listenzeile selbst.
Jetzt ist auch alles XHTML 1.0 Strict valide --> siehe hier
Also nochmal vielen Dank!
MfG
mephisto2k
Mein kläglicher Versuch sieht wie folgt aus
HTML
<ul>
<li class="no_bg"><h4>Tag 1 - Samstag, 24 Juli 2010</h4></li>
</ul>CSS
.no_bg {
background-color: transparent;
}Den CSS Code habe im Anschluss es im ersten Beitrags geposteten Codes eingetragen und ist somit die letzte Bedingung in dieser CSS Sparte.
Hallo,
ich habe eine Liste welche in einer einer global definierten Box liegt. Jetzt möchte ich das ein Listenpunkt dieser Liste, anders als alle anderen NICHT mit einer Hintergrundfarbe versehen ist. Versucht habe ich diesen Eintrag mit einer Klasse zu definieren, allerdings hatte dies keine Auswirkung. Egal ob ich eine andere Hintergrundfarbe definiere oder diese mittels 'transparent' auszublenden versuche.
Hat jemand eine Idee was ich tun könnte?
Folgend der HTML Code
<div id="content_list" >
<ul>
<li><h4>Tag 1 - Samstag, 24 Juli 2010</h4></li><!-- um die Hintergrundfarbe dieses Listenpunktes geht es mir -->
</ul>
<ul>
<div class="content_wrapper">
<li><a href="zin_amphi_2010.html">ZIN (Gewinner New Talents)</a></li>
<li><a href="din_a_tod_amphi_2010.html">DIN [A] TOD</a></li>
<li><a href="endofgreen_amphi_2010.html">End of Green</a></li>
<li><a href="ashb_heights_amphi_2010.html">Ashbury Heights</a></li>
<li><a href="welle_erdball_amphi_2010.html">Welle:Erdball</a></li>
<li><a href="blutengel_amphi_2010.html">Blutengel</a></li>
<li><a href="anne_clark_amphi_2010.html">Anne Clark</a></li>
<li><a href="and_one_amphi_2010.html">And One</a></li>
<li><a href="impressionen01_amphi_2010.html">- Impressionen -</a></li>
</div>
</ul>
</div>Im Detail geht um die erste unsortierte Liste, bzw. um den Listeneintrag.
Und hier der CSS Code
#content_list ul {
margin-bottom: 1.8em;
}
.content_wrapper {
-moz-box-shadow: 5px 5px 5px #a0a0a0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
box-shadow: 5px 5px 5px #a0a0a0;
border-radius: 5px;
}
#content_list li h4 {
margin: -1% -4% 5% 5%; /*top right bottom left*/
-moz-box-shadow: 5px 5px 5px #494949;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
box-shadow: 5px 5px 5px #494949;
border-radius: 5px;
line-height: 2em;
border: 1px solid white;
background: #999;
font-size: 1.3em;
min-height: 2em;
min-width: 50%;
color: white;
float: right;
}
#content_list ul li {
background: #666;
}Mir ist klar das ich mit dem untersten Eintrag des CSS Codes die Hintergrundfarbe Global für alle in der Box aufgeführten Listeneinträge setze, daher suche ich eine Art gebräuchlich Ausnahme Regelung...
MfG
mephisto2k
Perfekt genau das habe ich gesucht.
Tausend Dank!!!
MfG
mephisto2k
Hallo,
ich habe zwei Probleme mit meine Website die derzeit quasi aus Beta Gründen online ist.
Hier poste mein zweites Problem.
Es geht folgend um diese Seite: http://www.dunkelblicke.de/
Die sieht mit den aktuellen Browsern so aus wie ich es mir vorgestellt habe. Aber man will ja relativ Kompatibel sein und da macht mir der IE6 einen dicken Strich durch die Rechnung.
Teilweise ist das Layout total zerstört, was mich aber mehr wundert ist das es so manches mal nur zum Teil zerstört ist.
Da ich alles relativ gleich aufgebaut habe hoffe ich das mit vielleicht jemand einen Tipp für einen IE6 Hack geben kann wie ich mein Layout unter selbigem Browser zumindest nutzbar Gestalten kann.
Wenn ihr Euch zum Beispiel folgende Seiten mit einem IE6 anschaut seht Ihr was ich meine festival, fotografie und foto.art. Komplett zerstört ist das Layout auf dieser Seite links.
Für den Fall das jemand gerade keinen IE6 zur Hand hat gibt es hier einen Online-Simulator.
Ich habe übrigens eine css datei über Datei für den IE6 über Conditional Comments eingefügt. Nur weiß ich nicht was ich zur Beseitigung meines Problems dort eintragen kann...
MfG
mephisto2k
Hallo,
ich habe zwei Probleme mit meine Website die derzeit quasi aus Beta Gründen online ist.
Hier poste ist erst mal das Erste.
Es geht folgend um diese Seite: http://www.dunkelblicke.de/
Zum einen habe ich hier ein Problem mit der Positionierung einer H4 Überschrift. Zu finden auf: fotografie, foto.art, und links
Die Überschrift befindet sich in dem abgesetzten hellen Kasten auf der rechten Seite.
Mein Problem hier ist, das der Text der Überschrift (teils wird diese auch als Link verwendet) immer an dem oberen Rand der Box klebt. ich hätte den Text jedoch gern vertikal in der Box zentriert.
CSS
#content_list li h4 {
margin: -1% -4% 2% 1%; /*top right bottom left*/
-moz-box-shadow: 5px 5px 5px #494949;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
box-shadow: 5px 5px 5px #494949;
border-radius: 5px;
border: 1px solid white;
background: #999;
font-size: 1.3em;
min-height: 2em;
min-width: 50%;
color: white;
float: right;
}HTML h4
<li><h4>Tag 2 - Samstag, 5. Juni 2010</h4></li>HTML h4 a
<li><h4><a href="fotoart.html">foto.art</a></h4></li>Hat jemand eine Idee womit ich mir entweder selbst ein Bein stelle oder was ich vergessen habe?
MFG
mephisto2k
Hallo,
ich möchte für die Galerie meiner Website die Shadowbox.js nutzen.
Jetzt verwende ich in der Galerie allerdings Bilder im Hoch- wie auch im Querformat. Zwar ist es ein optisch ganz ansehnlicher Effekt das sich die Shadowbox dem Bild anpasst. Jedoch leidet darunter die Bedienerfreundlichkeit, es gibt in meinem Fall zwei mögliche Positionen an dem sich der "weiter" Button befinden kann. Die Bilder liegen immer in der selben Größe vor (unterschied ist eben Hoch- und Querformat).
Daher nun zu meiner Frage ist es möglich die shadowbox in der immer gleichen Größe anzuzeigen? Das die angezeigten Bilder nicht beschnitten werden, oder ist es möglich die Navigation an einer fixen Position zu setzen?
Aus der leider nur in englisch vorhandenen Dokumentation entnehme ich das man die Größe anscheinend mit initialHeight und initialWidth angeben kann. Die Angabe muss, laut Doku, in Pixel erfolgen. Allerdings wäre mir eine relative Angabe lieber. Gibt es da eine Möglichkeit etwas zu ändern?
Ein Beispiel meiner Webseite gibt es hier.
MfG
mephisto2k
Warum nicht gleich <noscript>?
Ganz einfach
Den "<noscript>" Tag kann ich bei XHTML 1.0 Strict leider nicht verwenden.
synaptic muss ich die id="noscript" auch irgendwie in der CSS Datei definieren?
Mein script Bereich sieht bis dato wie folgt aus
<script type="text/javascript" src="../../../scripte/shadowbox3/shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init();
</script>Müsste ich jetzt ein neues script tag öffnen oder kann ich den Eintrag von Dir unter den der Shadowbox packen?
MfG
mephisto2k
Hallo,
ich suche eine valide Möglichkeit den Besuchern meiner HP anzuzeigen das bei Ihnen JS deaktiviert ist. Grund hierfür ist die Verwendung der Shadowbox.
Den "<noscript>" Tag kann ich bei XHTML 1.0 Strict leider nicht verwenden. Daher frage ich hier ob es eine einfach zu implementieren Möglichkeit gibt, einen Text anzuzeigen wenn JS deaktiviert ist.
Ich möchte nicht das sich eine Infobox oder ähnliches öffnet (Tipps hierzu fand in durch die Suchfunktion), ich möchte nur das im Inhaltsbereich im Falle vom deaktivierten JS ein Text angezeigt wird. Oder wenn JS aktiviert ist das dieser Text nicht erscheint. Was das angeht bin ich leider nicht fündig geworden.
MfG
mephisto2k
Da habe ich ja was losgetreten...
Schon mal Danke für Eure Kommentare. Und Danke koslowski für den Tipp mit der Liste.
Jetzt Frage ich mich wirklich was sinnvoller, bzw. flexibler.
Irgendwann in ferner Zukunft möchte ich, wenn V1.0 erst mal online ist die Seite auch für Smart-Phones wie das iPhone und co. optimieren.
Mit dem Hinblick auf dieses Ziel, ich habe mir den Bereich Optimierung fürs Handy noch nicht angeschaut, was würde da mehr Sinn machen, Liste oder Tabelle?
MfG
mephisto2k