Suche auf lima-city
-
in: Abstand
geschrieben von cyclobox
Schon mal was vom Box-Modell gehört? -
in: Abstand
geschrieben von cyclobox
Mein Gott, du bist wirklich beratungsresistent, oder?
Hast du mehr margin, musst du gegebenenfalls den Wert von width anpassen.
Weiterhin solltest du echt langsam ein bisschen Eigeninitiative zeigen. Dir werden hier von etlichen Leuten konstruktive und korrekte Vorschläge geboten und du versuchst anscheinend nicht diese zu verstehen. -
in: Unbekannter Platzhalter
geschrieben von cyclobox
Ich weiß nicht, ob du die Sachen einfach nicht liest, auf die man dich hinweist, aber all die Sachen nach denen du hier in etlichen neuen Threads hinweist, habe ich dir bereits in dem einen anderem Thema gelöst. Du wärest gut daran beraten, dich auch mal ein wenig damit zu beschäftigen, wen dir jemand Vorschläge macht. -
in: Abstand
geschrieben von cyclobox
Feste Breite des Inhaltscontainers verhindert, dass der Text um die Navigation fließt.
Padding fügt dem Inhaltscontainer einen Abstand nach Innen hinzu, so dass er nicht so an den Rand gequetscht wirkt. -
in: 30km/h innerorts
geschrieben von cyclobox
Vielmehr sollte es an den wichtigen Stellen mit viel Verkehr durch schwache Verkehrsteilnehmer (Menschen ohne Stahlpanzer - Fußgänger) insbesondere durch Kinder/Schüler mehr 30er-Zonen bzw. auch Spielstraßen geben.
Weiterhin sollte sichergestellt werden, dass Schulwege etc. wenn möglich nicht über viel befahrene Straßen führen.
Generell 30 als Geschwindigkeitsbegrenzung ist übertrieben und nicht sinnvoll umsetzbar. Warum hat der Threadersteller ja schon dargelegt. -
in: Role Attribut
geschrieben von cyclobox
In etwa so soll (!) es einmal aussehen. Diese role-Attribute sind quasi ein Ansatz, um ein zugänglicheres Web zu schaffen.
Gut, eine Navigation mit dem Element <nav> erhält auch noch role="navigation", dass mag redundant wirken, aber das rührt daher, dass das Ziel der HTML5-Elemente (section, header, usw.) eher korrekte Semantik ist und die Zugänglichkeit durch beispielsweise Screenreader über die role-Attribute geregelt werden soll. -
in: Box Shadow Hilfe!
geschrieben von cyclobox
Wer etwas erreich will, muss gefälligst auch selbst was dafür tun. Dir fehlt absolutes Grundverständnis für die Anwendung von CSS und dem Aufbau einer einfachen Seitenstruktur. Du verwendest position:absolute um alles mögliche zu positionieren, dass ist absolut grauenhaft und falsch. Benutzer Margin und Padding für so etwas. Leg nicht überall sinnlose height, min-height-Eigenschaften fest und verwende nicht dauernd Eigenschaften, die dich irgendwie an dein Ziel führen, ohne das du weißt wie so.
Fang am besten von Null an und schaffe erst ein mal eine funktionierende Struktur, bevor du Inhalt positionierst oder eine Navigation formulierst.
In folgendem Code hab ich mal das clearende Div richtig gesetzt, weil du das immernoch nicht gemacht hast.
Ich hab auch keine Lust dir zig mal alles vorzukauen, ich hab schließlich alles völlig idiotensicher oben erklärt. Jetzt mach halt auch mal selber was.
<!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> <link rel="shortcut icon" href="images/favicon.png" /> <link rel="stylesheet" type="text/css" href="style.css" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>fabi-me.de</title> </head> <body> <div id="homepage"> <div id="header"> </div> <div id="navi"> <ul id="nav"> <li><a href="#">About Us</a></li> <li><a href="#">Our Products</a></li> <li><a href="#">FAQs</a></li> <li><a href="#">Contact</a></li> <li><a href="#">Login</a></li> <div class="clear"></div> </ul> </div> <div id="content"> <div id="contenttext"> <div class="oben"><div class="textoben">Seite wird bald gestartet !</div></div> <div class="unten"><div class="textunten">WITZLOS ! und <a href="downloads/rappidprofffence.zip">Download</a></div></div> </div> </div> <div id="contentmenu"> TEST </div> </div> </body> </html>
-
in: Ticker verdeckt die neusten News
geschrieben von cyclobox
Für mich sieht das Design ziemlich verschossen aus. TS-Viewer hängt unten nach dem kompletten Inhalt links an der Seite und die Artikel/News liegen über einem Rahmen. Wirken irgendwie zu breit. Ich denke da liegt irgendwo was größeres im Argen. -
in: Box Shadow Hilfe!
geschrieben von cyclobox
Das dort keine Höhe bzw. minimale Höhe definiert ist, muss auch so sein. Sonst funktioniert es nicht, wie du erkannt hast.
So, dann mach ich mich nochmal ans Werk.
1. Das <div class="clear"></div> hast du ja nun drinnen, leider direkt NACH dem </ul>-Tag, es muss davor stehen.
2. Warum hat die ID #nav ein float:left? Es langt, wenn die Listenelemente dieses bekommen (haben sie ja auch)
Weiterhin umfasst der DIV-Container #homepage schon die komplette Seite, aber ich vermute, dass er sich nicht auf die komplette Größe ausdehnt, weil irgendwo entweder float oder position:absolute; definiert wurde. Ja, dein Content und die Sidebar wurden beide über position:absolute positioniert.
position:absolute bewirkt, dass diese Elemente völlig aus dem Dokumentfluss genommen werden und deshalb erkennt der Container #homepage diese nicht mehr und hört schon nach dem Header und der Navigation auf.
Ich würde dir empfehlen dir einen anderen Weg zu suchen, wie man #content und #contentnavi positionieren soll.
Tipp: Das geht genauso wie schon bei der Navigation. Du benutzt float:left bzw. float:right und feste Breitenangaben und wieder diesen Trick mit <div class="clear"></div> um zu erreichen, dass #homepage den Inhalt nun auch beachtet. -
in: Box Shadow Hilfe!
geschrieben von cyclobox
Okey, okey, also nochmal Schritt für Schritt:
Geh in deine style.css Datei ung gleich oben, wo du die Styles für #content (nicht bei #homepage) festlegst, entfernst du diese 5 Zeilen:
box-shadow: 8px 0 10px #888, -8px 0 10px #888; -moz-box-shadow: 8px 0 10px #888, -8px 0 10px #888; -webkit-box-shadow: 8px 0 10px #888, -8px 0 10px #888;
Weiter: Bei #homepage entfernst du noch die Angabe height:242px; - die ist vollkommen überflüssig.
Weiterhin fügst du den style.css-Datei noch folgende Zeilen hinzu:
.clear { clear: both; overflow: hidden; height: 0; }
Danach entfernst du bei #navi ebenfalls die height Angabe (height:38px;).
In deinem HTML-Dokument schreibst du dann noch vor das Tag </ul> (also direkt bevor die Navigationsliste geschlossen wird) folgende Zeile - die Klasse hast du im Schritt davor ja in deiner style.css hinterlegt:
<div class="clear"></div>
Hintergrund zu den letzten paar Schritten:
Die Listeneinträge haben ja float:left. Die Elemente, die diese Liste dann umschließen (bei dir das DIV mit der ID #navi und die Liste UL mit der ID #nav), schrumpfen dann auf die Höhe 0 Zusammen, weil sie den Inhalt der Listeneinträge aufgrund von float ignorieren.
Man könnte nun - so wie du es gemacht hast - einfach diesen Elementen wieder eine feste Höhe zuweisen, aber das braucht man nicht. Durch das div mit der Klasse clear strecken sich die umfassenden Elemente wieder auf die Höhe der Listeneinträge - sie werden nicht mehr ignoriert. -
in: Box Shadow Hilfe!
geschrieben von cyclobox
1. Der umgebende Container (bei dir <div id="homepage">) hat eine feste Höhe. die Höhe wird vom Inhalt bestimmt, also von den innenliegenden Div-Containern. Entferne dies.
2. Auch die id navi bekommt eine feste Höhe. Warum? Weil du damit das Problem gelöst hast, dass die IDs navi bzw. nav eine Höhe von 0 hatten. Das liegt daran, dass die Listenelemente gefloatet sind. Um dieses Verhalten zu beheben schreibst du vor das Tag </ul> folgendes:
<div class="clear"></div>
Die Klasse clear erhält per CSS folgende Eigenschaften:
.clear { clear: both; overflow: hidden; height: 0; }
3. dein Container Content erhält ebenfalls box-shadow. der ist überflüssig und sorgt nur für den Schatten nach oben über die Navigation. Ich würde ihn entfernen. -
in: Slide In-Out Menü
geschrieben von cyclobox
cyclobox schrieb:
Ich glaube, dass ist nicht ganz das, was er sucht.
Such mal nach CSS3 Transitions und beschäftige dich damit. Das dürfte dir den gewünschten Effekt ermöglichen.
Zusammen mit der Pseudo-Eigenschaft Hover und als Block formatierten Links kannst du dann ein solches Menü realisieren.
Wie wärs, wenn du dich mit Vorschlägen beschäftigst, bevor du sie abtust?
Das was ich gepostet habe ist nämlich genau das, was du brauchst. -
in: Box Shadow Hilfe!
geschrieben von cyclobox
Du machst einfach einen DIV-Container um deine ganzen Elemente. also das öffnende <div id="wrapper"> direkt nach dem <body>-Tag und das schließende </div> direkt vor dem </body>-Tag und gibst diesem die box-shadow Eigenschaft:
#wrapper { box-shadow: 0 0 10px #000; } -
in: Abstände innerhalb einer Liste erzwingen
geschrieben von cyclobox
Links direkt hab ich keine, außer diesen Artikel, der sich aber direkt auf Wordpress bezieht:
http://www.wpbeginner.com/wp-themes/how-to-style-wordpress-navigation-menus/
Der Punkt, wo er weiter unten auflistet, wie man die einzelnen Elemente eines solchen Menüs mit Untermenüs anspricht, ist allerdings allgemeingültig.
Die Struktur
<div class="main-menu"> <ul id="menu"> <li class="menu-item"><!-- link --></li> <li class="menu-item"><!-- link --></li> <ul id="sub-menu"> <li class="sub-menu-item"><!-- link --></li> <li class="sub-menu-item"><!-- link --></li> </ul> <li class="menu-item"><!-- link --></li> </ul> </div>
Wie man jedes Element anspricht:
.main-menu /* die Container-Klasse */ .main-menu ul /* die erste Liste des Containers */ .main-menu li /* Hauptmenü Listenpunkt */ .main-menu li a /* Hauptmenü Link */ .main-menu li ul /* Liste für ein Untermenü */ .main-menu li li /* Untermenü Listenpunkt */ .main-menu li li a /* Untermenü-Link */ -
in: Abstände innerhalb einer Liste erzwingen
geschrieben von cyclobox
webdesignerin schrieb:
<li class="abstand"> habe ich versucht, kann ich aber nicht machen, weil im Stylesheet für das Menü bereits etwas für das <li> definiert ist und die von mir definierte Klasse deshalb ignoriert wird.
Genau so funktioniert es aber.
Poste mal eine Beispielseite, aus der diese Menüstruktur und alle nötigen CSS-Zeilen ersichtlich werden.
Du kannst doch auch zwei Klassen für ein Element definieren: <li class="menu-item abstand"> -
in: Slide In-Out Menü
geschrieben von cyclobox
Ich glaube, dass ist nicht ganz das, was er sucht.
Such mal nach CSS3 Transitions und beschäftige dich damit. Das dürfte dir den gewünschten Effekt ermöglichen.
Zusammen mit der Pseudo-Eigenschaft Hover und als Block formatierten Links kannst du dann ein solches Menü realisieren. -
in: Role Attribut
geschrieben von cyclobox
HTML5 Elemente können alle das role-Attribut bekommen und dient dazu Benutzern mit besonderen Ansprüchen zu helfen, einzelne Elemente deiner Website zu identifizieren, um besser auf die Seite zuzugreifen (z.B. per Screenreader). -
in: Direkter Foto upload
geschrieben von cyclobox
Dann mach du mal eben meine Arbeit für lau.
Man muss schon selbst was erarbeiten, eine Grundidee formulieren, ein ausgedachtes Konzept vorlegen. Ein Forum funktioniert nicht nach dem Prinzip "Ich will, mach mal." -
in: css Internet Explorer optimieren
geschrieben von cyclobox
ftools schrieb:
Das liegt daran das IE schlechter ist!
Musst einen anderen Browser nehmen!
Mit Google Chrome und anderen Browsern hast du keine Probleme!
Der IE kann z.B auch keine Canvas anzeigen!
Darum geht es nicht. Nicht jeder hat die Freiheit/das Wissen einen anderen Browser als IE7, IE8, usw. zu verwenden. -
in: Sonderzeichenfehler - Wie beheben?
geschrieben von cyclobox
...über WELCHES CMS? -.-
Und charset meta Angabe sollte noch vor dem title-Tag stehen. -
in: Sonderzeichenfehler - Wie beheben?
geschrieben von cyclobox
Diese Angabe im Header des HTML-Dokuments sollte weiterhin direkt nach dem <head>-Tag erfolgen. -
in: I Pod Touch Jailbreaken Legal oder nicht Legal?
geschrieben von cyclobox
rigert2012 schrieb:
Man kann sich darüber streiten ob ein Jailbreak legal oder illegal ist.
Wenn du deinen Ipod jailbreakst verlierst du somit die garantie.
Hättest du die Beiträge hier gelesen, wüsstest du, dass das eben nicht so eindeutig zu sagen ist. -
in: Zoom Fehler
geschrieben von cyclobox
Die Div-Container werden alle so verschoben, wie man es als "Zoomer" erwartet. Ein nettes Extra wäre es, dass die Div-Container mit relevantem Inhalt nicht über die größe des Viewports (100% des Fensters) gehen. Aber wie gesagt, vom Zoomverhalten passt das hier.
Screenshots helfen ;) -
in: Design bewerten
geschrieben von cyclobox
Zum Design spar ich mir jetzt mal lieber meine Tipp-Power, aber mal so nebenbei.
Warum verwendest du den HTML5-Doctype ohne überhaupt die HTML5-Markup-Elemente zu verwenden oder andere Techniken?
Außerdem muss man bei der Verwendung von HTML5 auch noch andere Dinge im Quelltext beachten.
Es hilft leider herzlich wenig, etwas nur deshalb zu verwenden, weil es "neu und gut" ist, wenn man es nicht versteht. Such mal nach einem HTML-Validator und überprüfe damit dein HTML-Dokument auf etwaige Fehler. Da ist noch Einiges zu tun. -
in: Notepad++: Verhunzt Dateien durch doppelte Zeilenumbrüche
geschrieben von cyclobox
Okey, ich versuche es wie du zu reproduzieren. Mit der style.css kann ich folgendes reproduzieren - verwendet wurde die für euch hochgeladene:
- im Notepad++ öffnen: Sieht gut aus
- in Dreamweaver öffnen: Sieht gut aus
- im Windows Editor öffnen: Alles in einer Zeile dargestellt
- mit Wordpress-Theme hochgeladen: Wordpress kann mit Datei nichts anfangen - Internal Server Error - muss das Theme-Verzeichnis löschen
Wenn ich z.B. eine index.php, die ich in einem Theme verwende und die funktioniert, teste:
- im Notepad++ öffnen: jede Zeile mit extra Zeilenumbruch
- in Dreamweaver öffnen: jede Zeile mit extra Zeilenumbruch
- im Windows Editor öffnen: Sieht gut aus
- mit Wordpress-Theme hochgeladen: Funktioniert
Ich kann sie aber nicht "gescheit" bearbeiten. -
in: Notepad++: Verhunzt Dateien durch doppelte Zeilenumbrüche
geschrieben von cyclobox
@fatfox: deinen Beitrag hab ich noch garnicht gesehen.
OS: Win7 64-bit
Notepad++ Version: 6.0 (nun 6.1.2 nach Update)
Wordpress-Kodierung: UTF-8
Standard-NPP-Kodierung: ANSI (bei neuen Dateien)
Ich hatte sonst auch nie Probleme damit, aber jetzt ist eben mein ganzes Theme zerschossen und finde einfach die Fehler nicht.
Hier mal die Dateien:
http://cyclobox.lima-city.de/examples/style.css
http://cyclobox.lima-city.de/examples/header.txt
http://cyclobox.lima-city.de/examples/index.txt
http://cyclobox.lima-city.de/examples/footer.txt
http://cyclobox.lima-city.de/examples/functions.txt
Die Originaldateien (als .css und .php) gepackt:Ach da war die Downloadserver-Sache..
[url]http://cyclobox.lima-city.de/examples/theme-files.zip[/url] -
in: Notepad++: Verhunzt Dateien durch doppelte Zeilenumbrüche
geschrieben von cyclobox
Nein, leider nicht. Das hab ich schon entdeckt.
Sobald ich die Dateien online bearbeite, haben sie ja Mac-Zeilenenden, die mein Notepad++ aber nicht so wie im Wordpress-Editor darstellt, sondern nach jede Zeile einen weiteren Umbruch anzeigt. Ich würde die Dateien nun gerne genauso bearbeiten, wie sie im Wordpress-Editor auch dargestellt werden.
Ändere ich die Zeilenenden tut sich garnichts. -
in: Notepad++: Verhunzt Dateien durch doppelte Zeilenumbrüche
geschrieben von cyclobox
Und wie bearbeite ich wordpress-theme-Dateien dann, ohne das ich sie in Notepad++ verhunzt sehe?
Wo entsteht denn mein Problem? Ich finde dazu auch keine aussagekräftigen Artikel über Google.
*edit:
Wenn ich Theme-Dateien im Wordpress-Backend bearbeite und aktualisiere, dann bekommen sie Mac-Zeilenende. -
in: Notepad++: Verhunzt Dateien durch doppelte Zeilenumbrüche
geschrieben von cyclobox
Hallihallo,
Seitdem ich mich in wordpress einarbeite, verhunzt mir Notepad++ die Dateien - dort wo in normalen Editoren einfache Zeilenumbrüche bzw. Leerzeilen sind fügt es noch eine weitere ein. Ich hielt es zunächst für einen Wordpress-Bug, der beim Online-Bearbeiten der Dateien dieses Verhalten erzeugt.
Das es nicht so ist musste ich auf schmerzhafte Weise lernen, als ich die ganzen Leerzeilen aus meinen Theme-Dateien entfernt habe, nur um dann zu merken, dass ich sie damit eigentlich erst richtig verhunzt habe.
Öffne ich die Dateien jetzt im normalen Editor, habe ich meinen ganzen Code auf eine einzige Zeile zerstört. Ich dreh mich hier grad wie Rumpelstielzchen im Kreis.
Was hab ich falsch gemacht? Wo kann ich ansetzen? Was ist nur in diesem Editor los?
OS: Win7 64-bit
Notepad++ Version: 6.0 (nun 6.1.2)
Wordpress-Kodierung: UTF-8
Standard-NPP-Kodierung: ANSI (bei neuen Dateien) -
in: Kennt jemand einen GUTEN HTML Editor
geschrieben von cyclobox
Phase V ist wie Dreamweaver, nur noch ein bisschen schlimmer. -
in: Objekt vertikal zentrieren
geschrieben von cyclobox
Okey, ich verstehe, dass ist nicht so einfach. Mir fällt da direkt keine Lösung ein.
Ich stand neulich auch vor der Aufgabe etwas sowohl horizontal, als auch vertikal zu zentrieren. Dabei war die Struktur wie unten gezeigt, allerdings hatte ich den Vorteil, dass es eine statische Landingpage war und ich somit von allen drei Bildern sowohl Breite, als auch Höhe kannte. Folglich konnte ich die Container entsprechend mit der Gesamtbreite bestücken.
<div id="container"> <div id="box"> <div class="left"> <a href="#"><img src="" /></a> </div> <div class="middle"> <a href="#"><img src="" /></a> </div> <div class="right"> <a href="#"><img src="" /></a> </div> </div><!--end box--> </div><!--end container-->
Was aber vielleicht auch eine Idee wäre, dass du die Auswahl von Fotos über die Fotos selbst bringst und dann die Fotos unmittelbar darunter anzeigst. Ich denke vertikale Zentrierung ist da unnötig.
Weiterhin halte ich die Dopplung der Menüpunkte (also Navigation mit Grafik links und Textnavigation als Footer) für zu sehr redundant. Die untere Variante würde ich rausnehmen und die Buttons links nicht so hoch machen, weil jeder Laptop-Benutzer dann innerhalb der Navigation scrollen muss. -
in: Kennt jemand einen GUTEN HTML Editor
geschrieben von cyclobox
Dreamweaver? Ernsthaft? Ich hab nie verstanden, wie man so etwas professionell verwenden kann. Notepad++ kann genauso HTML, CSS, PHP und noch viel mehr. Dreamweaver als HTML-Editor ist, als ob ich mit meinem Privatjet Einkaufen fliegen würde. -
in: Raster- oder Vektorgrafik für Homepage?
geschrieben von cyclobox
drafed-map schrieb:
Ich möchte noch einwerfen, dass auch die modernen Browser nicht in der Lage sind, Pixelgrafiken gut zu skalieren.
Offenkundig, da Pixelgrafiken nunmal Pixelgrafiken sind. Wie soll aus 300px * 300px skaliert auf 150px * 150px gleichbleibende Bildqualität resultieren, wenn die Grafik keine Informationen darüber enthält, wie es die Grafik zu skalieren hat? Es muss runter gerechnet werden und dabei entsteht eben Pixelbrei.
Wenn man bei siner Website auf absolut feines responsive design setzen will, dann muss man eben die Bereiche mit Bild, die skalieren sollen, so gestaltetn, dass es auch mit Pixelgrafiken möglich ist.
Einfache, horizontale oder vertikale Gradienten, usw. Es ist ohnehin nicht so sinnvoll alle möglichen Grafiken zu skalieren, da der Abstand den ein Internetbenutzer zum Bildschirm hat meistens ähnlich groß ist - egal ob riesiger Bildschirm oder Laptop. -
in: Suche Tipp und Trick zur meiner Seite.
geschrieben von cyclobox
die-city schrieb:
Ich habe verdammt viele Schriftarten aber ich habe mehrer durch Probiert ich fand das es nun "Cambria" gut dazu passt.
Schriftarten sind so eine heikle Sache. Das Problem, was oben schon einmal genannt wurde, ist, dass die meisten Schriften nicht auf allen Systemen zur Verfügung stehen.
Cambria ist z.B. eine von den neuen Windows-Schriften und ohne Zweifel eine ziemlich Gute, wie ich finde. Sie gibt es allerdings nicht so ohne Weiteres auf Macs bzw. Linux-Systemen.
Deswegen verwendet man beim Festlegen von Schriftarten den so genannten Fall-Back-Mechanismus. Hier ein Beispiel von meinem Blog:
body { background: #eee; color: #222; font: 93.75%/1.4 "Lucida Sans Unicode", "Lucida Grande", Helvetica, Verdana, Arial, sans-serif; padding: 0; margin: 0; }
Wie du siehst lege ich mit der Kurzschreibweise von font neben 93.75% Schrifthöhe (entspricht 15px bei den meisten Browser Standards) und 1.4-facher Zeilenhöhe eine Vielzahl von Schriften fest. Es wird zu erst überprüft, ob die Schrift ganz links auf dem System ist und dann wird immer die nächste probiert. Gibt es keine der genannten Schriftarten, so greift der letzte Eintrag "sans-serif", der dem Browser sagt, er soll die serifenlose (sans-serif) Standardschrift dieses Systems verwenden.
- "Lucida Sans Unicode" ist sehr ähnlich zu "Lucida Grande", erstere gibt es auf Windows-Systemen und letztere auf Macs
- Helvetica ist auch sehr schön und ist quasi der Anker, falls es dir ersten beiden wirklich nicht geben sollte
- Arial und Verdana sind nun so gut wie überall verfügbar. Diese werden als letztes abgefragt -
in: Doctype XHTML definieren ?
geschrieben von cyclobox
Klick mit mittlerer Maustaste und du sparst dir das schließend alter Tabs, weil wieder irgendwo _blank drin war.
Macht 0 Mehrafuwand und man hat als Benutzer die Kontrolle. Mit _blank wird einem diese Kontrolle genommen. So einfach ist das. -
in: Suche Tipp und Trick zur meiner Seite.
geschrieben von cyclobox
imho schrieb:
Die verwendete Schirtfart Times New Roman ist auch einfach nur hässlich.. Grundsätzlich gilt serife Schriften nur bei längeren TExten, non-serife bei kürzeren Texten
Was zum Kuckuck? Dieser Grundsatz ist mir aber verdammt neu.
Es kommt immer darauf an, um was bei der Seite geht, ob überhaupt viel Text vorhanden ist, usw. Dir gefällt Times New Roman nicht. Na und? Vielleicht gefällt sie ihm ja und er hält sie für geeignet? Es ist auch nicht meine Leiblingsschrift, aber das bleibt doch wohl im Auge des Betrachters.
Serifen kann man auch wunderbar ganz sparsam als Überschrift oder für Marginaltext verwenden. Auch für kurzen Fließtext, wenn eine ausreichende Schrifthöhe eingestellt ist. -
in: Objekt vertikal zentrieren
geschrieben von cyclobox
Dann liefer mal ein aktuelles Beispiel, an dem wir selbst ein bisschen per Firebug testen können. -
in: Doctype XHTML definieren ?
geschrieben von cyclobox
Genau, man nimmt lieber 1.0 aus den von dir erörterten Gründen.
Was ich allerdings ganz und garnicht verstehe. Die strict-Validität, die eigentlich angestrebt werden sollte gibst du auf, damit target="_blank" Links als valida erkannt werden. Warum? Solche Links sind nicht mehr als Benutzer-Gängeleien und ich rege mich über jeden Link dieser Art auf. Ganz einfach deshalb, weil man mit zig Möglichkeiten bestimmen kann, was mit einem Link passieren kann. -
in: Wie findet ihr das HP-Design?
geschrieben von cyclobox
Ich hab ja bereits gesagt, dass das Dokument schon mal an sich nicht fehlerfrei ist:
http://validator.w3.org/check?uri=http%3A%2F%2Faskarian.net%2F&charset=%28detect+automatically%29&doctype=Inline&group=0
Am besten, du schaust, dass du die Fehler beseitigen kannst und versuchst dann, das Design zu verbessern. Denn es kann ziemlich fummelig werden ein Layout, welches auf fehlerhafter Konstruktion beruht, zu ändern.
Zum Design an sich:
- Fließtext zentriert darstellen sieht nicht gut aus
- versuche mehrere Stichpunkte als Listen darzustellen (also z.B. die Sachen, an denen du noch kämpfst) - ALSO MIT LISTENPUNKTEN
- unter den grün hinterlegten Überschriften ist ein blauer Punkt - eine Grafik. Was hat die da zu suchen?
Zum Schluss: Warum versuchst du alles dynamisch zu laden?
*edit:
Kommt das nur mir so vor, oder sieht das Logo aus wie irgend so ein alpines Quellwasser? -
in: Raster- oder Vektorgrafik für Homepage?
geschrieben von cyclobox
ftools schrieb:
Vektor ist besser aber Rastergrafiken werden meistens eingesetzt da die weniger Platz brauchen.
Eine Vektorgrafik kannst du vergrößern ohne Verlust der Qualität!!
Ich empfehle dir SVG zu nehmen.
Das sind die einzigen unterschiede.
Er hat doch gesagt, dass er sich damit ein bisschen auskennt. Ergo ist er aufgrund der von dir genannten Vorteile überhaupt auf die Idee gekommen, darüber nachzudenken, ob Vektorgrafiken nicht besser geeignet sind.
Sind sie aber nur in der Theorie, da die Implementierung und Unterstützung von Vektorformaten (namhaft SVG) mehr als dürftig ist.
Nehm Rastergrafiken und auch bei diesen gilt es nicht zu übertreiben. Vieles kann man auch über CSS lösen. -
in: Links in Beiträgen und auf der Seite
geschrieben von cyclobox
Es gibt zig Möglichkeiten als Benutzer selbst zu entscheiden, wie und wo ein Link geöffnet werden soll:
- Link per Drag & Drop an die Stelle ziehen in der Tableiste, wo er geöffnet werden soll
- Klick mit der mittleren Maustaste
- Rechtsklick -> In neuem Tab öffnen
- ...
Es ist eine Unart Links per _blank zu öffnen, manchmal ist es nämlich auch hinderlich, wenn man dann die "alten" Tabs erst schließen musst. Das sind genau die Sorte von Interaktion, die dem Benutzer überlassen werden müssen. -
in: Humble Indie Bundle V
geschrieben von cyclobox
Okey, dass ist natürlich für die Linux-Gemeinde sehr schade. Kannst du sagen, ob sich das von Distribution zu Distribution unterschiedlich verhält oder sind das erstmal nur deine Erfahrungen?
Vielleicht ist ja Besserung zu erwarten, wenn Valve Steam für Linux portiert hat, wer weiß.
Zudem muss natürlich gesagt sein, dass viele kleine Entwicklerstudios zwar tadellose Arbeit abliefern, es sich bei denen aber wie gesagt um KLEINE Entwicklerstudios handelt. Große und umfangreiche Testszenarios sind bei denen also nicht so ohne weiteres möglich.
*edit:
"@6: Bei den Grafikoptionen einfach shadows und fsfx deaktiviert und jetzt flutschts"
(via http://ikhaya.ubuntuusers.de/2012/06/01/ausgabe-5-des-humble-indie-bundle/)
*edit2:
Zum Thema kein Sound bei Limbo soll die Verwendung einer eigenen Wine-Installation helfen.
(via http://mamu.backmeister.name/planet-u/humble-indie-bundle-v/) -
in: Webseite seriös gestalten
geschrieben von cyclobox
Zudem sollte eine Website gut strukturiert sein. Menüs oben und unten und verrückte Animationen verhindern so etwas. Es muss klar erkennbar sein, was ein Link ist und was nicht. Verwende Farben, aber harmonisch. Farben sollten entweder dezent in großen Flächen vorhanden sein oder eben als deutliche Akzente. Dabei kann man dann verschiedene Abstufungen der Farben wählen (Color Schemes) bzw. auch mit zunächst nicht zueinander passenden Farben experimentieren.
Auf ein gut lesbares Schriftbild sollte wert gelegt werden. Größer ist hier besser, die meisten Schriften unter 14px Schrifthöhe sind im Web nicht gut lesbar. Der Standardwert für Schriften, der in allen Browser voreingestellt ist, ist 16px und das ist er nicht ohne Grund. Bei Schriften sollte man übrigens mit relativen Angaben arbeiten - hat man sich daran gewöhnt, erleichtert einem das viel Arbeit.
In diesem Zusammenhang kann man für das Body-Element 100% Schriftgröße festlegen und dann nach Wunsch bei anderen Elementen (Paragrafen, Überschriften) die Schriftgrößen dazu relativ festlegen. Habe ich meine Schrift über das body-Element im Dokument auf 100% (entspricht meist 16px) festgelegt und definiere nun für eine Überschrift 1. Ordnung (also H1) 1.6em Schrifthöhe, so hat diese Überschrift 160% der anfänglichen Schrifthöhe (100% = 16px -> 16px * 1.6 = 25.6px). -
in: Humble Indie Bundle V
geschrieben von cyclobox
Hallihallo,
Viele von euch werden das schon kennen, für die als Erinnerung und für die, die es eben noch nicht kennen:
http://www.humblebundle.com/ (Amnesia: The Dark Descent, Psychonauts, Limbo, Superbrothers: Sword & Sorcery EP, Basten - wenn man mehr als der Durchschnitt bezahlt, alle Soundtracks zu den Spielen)
Die Humble Bundles erscheinen in etwa alle 1-3 Monate und enthalten zahlreiche Spiele kleiner Entwicklerschmieden - meist samt Soundtracks, Bonusmaterial, Steam-Keys, etc. Dabei wählt man selbst aus, wie viel man bezahlen möchte und in welchen Teilen es a) an die Spieleentwickler selbst, b) an die Veranstalter von Humble Bundle und c) an einer Charity Organisation geht.
Ob man nun assozial ist und nur 1 Dollar bezahlt oder so verrückt wie Notch (Ja, der Markus "Notch" Persson von Mojang AB - Minecraft) und 6,543.21 $ bezahlt, womit er gerade mal Dritter in der Rangliste ist, bleibt euch überlassen.
Bezahlen kann man per PayPal, Amazon Payments und Google Checkout. Weitere Details findet ihr auf oben verlinkter Homepage.
PS: Beim Laden der Spiele über Steam ist mir folgende Überirdischkeit aufgefallen:
http://cyclobox.lima-city.de/download-rate.png
42.3 MB/s Download-Rate als Maximalwert? O.o -
in: css Internet Explorer optimieren
geschrieben von cyclobox
tid-gaming schrieb:
Aus
.file
{
border: 1px inset #666666;
font-family: tahoma, helvetica, arial;
font-size: 12px;
height: 18px;
}
kann
.file{border:1px inset #666666;font-family:tahoma,helvetica,arial;font-size:12px;height:18px}
gemacht werden.
Das kannst du für alle Zeilen machen.
Am besten noch doppelte Einträge zusammenfassen.
Nur um völlig wartungsstörenden, unsauberen Code zu produzieren? Das ist vielleicht sinnvoll, wenn man das bei großen Projekten vor dem Parsen von PHP erledigen lässt - und zwar nur serverseitig, aber von Anfang an seinen Quelltext so zu verstümmeln?
Das sind ohnehin Schritte, die man machen kann, wenn auch die ganzen anderen (teils echt groben) Schnitzer im HTML/CSS beseitigt worden sind. -
in: css Internet Explorer optimieren
geschrieben von cyclobox
Ich glaube nicht, dass sich jetzt jemand hinsetzt und deinen kompletten CSS-Code von vorn bishinten auf Inkompatibilität mit dem Internet Explorer sucht.
Zumal mir hier grundlegendes Verständnis beim Aufbauen eines HTML-Dokuments mit zusätzlichen CSS fehlen zu scheint. Siehe Validator-Ergebnis: "68 Errors, 37 warning(s)"
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.cumail.de&charset=%28detect+automatically%29&doctype=Inline&group=0
Die Seite lädt auch extrem langsam und als ich sie mit dem Internet Explorer geöffnet habe kam zwei mal ein UAC Fenster bei Windows 7, ob der Flashplayer installiert werden darf und das ohne, dass ich irgendwohin geklickt hätte. -
in: Durchgezogene Linie
geschrieben von cyclobox
wzone schrieb:
PS: margin würde ich auch immer definieren, weil manche Browser sonst selber einen setzen
Früher habe ich auch immer erstmal für alles die margins entfernt, aber mittlerweile lasse ich sie erst einmal dran und entferne margins nur, wenn ich sie wirklich nicht brauche. Einige margins von Elementen wie p-Tags sind nämlich zum Beispiel manchmal ganz sinnvoll.
Vom Traum in allen Browser pixelgleiches Layout zu entwickeln, kann man sich zudem auch gleich verabschieden, dass wird es nicht geben.
Weiterhin sind Angaben wie diese:
margin: 0px 0px 0px 0px;
ziemlich redundant. Stattdessen langt auch
margin: 0;
Ob der Browser nun 0 Pixel, 0 Punkt, 0 Em oder 0 Prozent nehmen soll, ist einerlei. Die Angabe der Einheit ist als bei 0 überflüssig. Weiterhin kann man bei Margin und Padding bei gleichen Werten oftmals Schreibarbeit sparen. Stichwort Kurzschreibweise (engl. Shorthand). -
in: Wordpress: Blog in zwei seperate Bereiche unterteilen
geschrieben von cyclobox
Ich habe nebenbei meinen einzigen Ansatz weiterverfolgt, das über getrennte Kategorien zu regeln und veranschauliche das jetzt an diesem Beispiel noch einmal.
- Ich habe jetzt für die zwei Bereiche je ein Seiten-Template angelegt, welche wie eine Blogseite ein Loop haben, welches jedoch nur Einträge aus einer Kategorie (Kategorie 1 = Bereich 1) anzeigt. So kann ich beide Bereiche schon einmal inhaltlich trennen
- Nun muss ich von meiner statischen Landingpage auf diese Seiten verlinken und hätte praktisch das erreicht, was ich wollte.
Mit gefällt es nun nicht so richtig, dafür Kategorien zu missbrauchen, da gibt es doch bestimmt auch andere Lösungen, richtig?
*edit:
Und jetzt hab ich auch ein Problem mit dieser Lösung entdeckt. Ich verwende zu den Kategorien, die ich oben aufgezählt habe Unterkategorien, welche ich auch als Menüpunkte darstellen möchte.
Ich bräuchte also für all diese Kategorien ein Template, welches sich abhängig von der gewünschten Kategorie verhält (macht ja eine normale category.php), aber zusätzlich nur auf Basis des Templates für die Oberkategorie erstellt wird -
in: Wordpress: Blog in zwei seperate Bereiche unterteilen
geschrieben von cyclobox
Hallihallo,
Ich erstelle gerade eine kleine, private Website. Zunächst landet man über eine home.php auf einer statischen Startseite, über die man dann zu den beiden Unterbereichen kommt. Zur Veranschaulichung stellt euch einfach vor, die Website wäre in zwei gleiche große Blöcke geteilt, der linke Block führt zu Seitenbereich A und der rechte Block zu Seitenbereich B.
Wie realisiere ich das mit Wordpress? Ich könnte natürlich einfach zwei Kategorien erstellen und dann auf die Kategorienseite verweisen, dass wirkt mir aber recht Quick'n'Dirty. Gibt es da eine bessere Lösung?
Mit freundlichen Grüßen,
cyclo -
in: Microsoft Security Essentials
geschrieben von cyclobox
ftools schrieb:
Ohne kostenpflichtige Virenscanner würden viele Vieren noch ohne zu wissen das es sie gibt existieren.
Achja? Warum? Das möchte ich schon gern näher erläutert haben.
edit by bladehunter: Zitat eingefügt und das zitierte Post gelöscht. Grund: Der Postautor hat sich nicht genügend Mühe gegeben, seine Aussage verständlich zu formulieren. -
in: Suche Kritik und Anregungen zu meiner Fotoseite
geschrieben von cyclobox
Zudem was die anderen schon hinreichend erläutert haben:
Das Wasserzeichen, sofern man das noch so nennen kann, ist zu übertrieben und auffällig. Über den Sinn eines solchen lässt sich ohnehin streiten, aber wenn man schon eins drauf macht, dann sollte es doch grade bei solchen Fotos keines sein, was einem sofort ins Auge springt.
Ein Wasserzeichen sollte erkennbar sein, wenn man danach sucht, aber nicht sofort beim Betrachten der Bilder schon den "Autofokus der Augen" erhalten. -
in: Daten als float speichern
geschrieben von cyclobox
my-easytools schrieb:
Vielleicht hatte jemand ja schon mal ein ähnliches Problem
Ja, in der Tat. Das Problem hatten neben dir wohl schon Tausend andere auch. Aber mit so ungenügenden Angaben wird dir da wirklich niemand weiterhelfen. Mehr Code und Struktur der Tabellen, wie schon gefordert, oder du darfst selber weiter Fehler suchen. -
in: Wordpress: Hauptindex-Template (index.php) verbessern
geschrieben von cyclobox
Hallo Stephan,
Mit der Sitemap im Footer hab ich mich nur dahingehend beschäftigt, dass ich nun im Backend das Menü konfigurieren kann und anschließend dem "Menüplatzhalter", also in diesem Fall im Footer, zuweise. Gleiches funktioniert auch mit der Hauptnavigation unterhalb des Headers, welche ich eben fertiggestellt habe. Hover Submenüs, etc. sind dabei. Das kannst du dir ja noch mal anschauen, gefällt mir so aber mittlerweile ganz gut. ;)
Automatische Breite für den Content-Bereich (section):
Das ist die offensichtliche Variante, in der zunächst die Sidebar, der ich problemlos eine fixe Breite geben kann, platziere und rechts floate und anschließend den Content-Bereich anzeigen lasse, welcher dann den freien Platz den die Sidebar übrig lässt, ausnutzt.
Das funktioniert auch. Aber mir wäre es ehrlich gesagt lieber, wenn zuerst der Contentbereich gerendert wird. Das ist vor allem hinsichtlich auf die Suchmaschinenoptimierung bzw. Screenreader relevant. Dort ist die sichtbare Navigation nämlich von zweitrangiger Bedeutung. Da muss ich jetzt wohl mal in mich gehen, was mir wichtiger ist.
Vielleicht kann man bei der Verwendung eines speziellen Templates das section-Element auch mit einer speziellen Klasse/ID rendern, die ich nur verwende, wenn ich keine Sidebar brauche und dann darüber eben 960px (was der Breite von Header bzw. Footer entspricht) festlege.
*edit2:
Ich habe nun folgenden CSS-Code hinzugefügt, da ich durch die Body-Klassentags die section nur dann auswählen kann, fals eine bestimmte Klasse im Body vorhanden ist.
.page-template > #wrapper > section { float:none; min-height:500px; width:940px; /* 960px abzüglich 2x 10px für Padding Links & Rechts */ }
Collapsing Margins:
Jap, dass funktioniert. Es ist allerdings eher ein kleiner Workaround gegen ein meiner Meinung nach nicht ganz intuitives Verhalten.
Wenn ich meinen Header mit Hgroup und je einer H1- und einer H2-Überschrift habe und ich gebe Hgroup etwas margin. Dann soll sich die Hgroup vom Header abstoßen und nicht vom Body bzw. Browser-Viewport.
Sorry, dass ich so kleinlich bin, aber das ist gute Übung für mich und versuche mir grad anzugewöhnen, Dinge nur so zu lösen, wie sie vorgesehen sind, ohne Techniken zu "missbrauchen". Ich bedanke mich aber ausdrücklich für deine Hilfen.
*edit: Zum Thema Sidebar vom Content abgrenzen: Darüber mache ich mir noch Gedanken. Deine Möglichkeit aus dem Bild ist ganz gut, allerdings nur, wenn der Inhalt auch höher ist, als die Sidebar. Na mal sehen. -
in: Kasten mit Ecken um Link
geschrieben von cyclobox
Okey, dann hier erstmal ein Tipp. Du verwendest float:left um die a-Elemente nebeneinander anzuzeigen. Darum solltest du nach diesen Menüelementen, also bevor du <div class="navi"> mit </div> schließt, folgendes schreiben:
<div class="navi"> <!--Menü Elemente--> <div class="clear"></div> </div>
Die Klasse clear, die du in dem leeren Div-Container verwendest, erhält dann folgende CSS-Eigenschaften:
.clear { clear: both; height: 0; overflow: hidden; }
Sonst zerschießt du dir durch das Float das umliegende Layout. Es gibt auch noch andere Möglichkeiten diesen Effekt zu erreichen, ohne einen zusätzlichen DIV-Container einzubauen, allerdings sind diese Lösungen auch mit einem Mehraufwand verbunden, da sie komplizierter sind. Falls dich das aber interessiert, hier ist ein sehr ausführlicher Artikel dazu (englisch): http://www.positioniseverything.net/easyclearing.html
Weiterhin empfinde ich die Menüpunkte als zu hoch, zumal die Unterpunkte genauso hoch sind und somit viel von der Seite verdecken. -
in: Kasten mit Ecken um Link
geschrieben von cyclobox
Es wäre eventuell auch hilfreich einmal den konkreten Anwendungsfall zu sehen. Also wo du das verwenden willst.
Ich selbst verwende bei border-radius die Vendor-Prefixes nicht mehr, dieses CSS3 Feature kann man getrost ohne verwenden. -
in: Kasten mit Ecken um Link
geschrieben von cyclobox
Wenn du willst, dass man überall im Kasten auf den Link klicken kann und nicht nur, wenn du über den Linktext fährst, dann geht das folgendermaßen:
HTML Markup:
<p> <a href="#" class="menu-item">Link 1</a> <a href="#" class="menu-item">Link 2</a> </p>
CSS:
.menu-item{ display: block; padding: 10px 30px; border-radius: 4px; color: #ffffff; background-color: #222222; }
Der Link selbst, also das a-Element muss dann per display:block zu einem Blockelement werden. Dazu noch ein bisschen Innenabstand über padding und man hat einen schönen Button.
Das stimmt, border-radius wird nicht von allen Browser unterstützt. Aber das sind nur sehr Alte. border-radius ist eine der CSS3-Eigenschaften, die alle namhaften Browser schon lange unterstützen. Die älteren dabie benötigen sogenannte Vendor-Prefixes.
Neben der normalen border-radius Eigenschaft definiert man noch für alle Browser(-engines) welche mit Vendor-Prefix. Aber vor die Eigenschaft ohne Prefix:
(...) -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; (...)
Hier kannst du ganz genau nachlesen, welcher Browser diese eigenschaft ab welcher Version unterstützt:
http://caniuse.com/#search=border-radius -
in: Kasten mit Ecken um Link
geschrieben von cyclobox
Dafür gibt es die CSS3 Eigenschaft border-radius. Das ganze kann man dann noch wahlweise mit einem Rahmen kombinieren. Selbiges funktioniert auch mit Links. Diese müssen dann aber die Eigenschaft display:block aufweisen oder eben in einem DIV mit abgerundeten Ecken stehen.
Folgender HTML-Code:
<div class="kasten"> <!--Irgendwas, ein Link, ein Paragraph, ein Bild, ...--> </div>
...mit folgendem CSS:
.kasten{ width: 200px; height: 50px; background-color: red; border-radius: 4px; } -
in: News Rotator
geschrieben von cyclobox
Eine Slideshow kann man mittlerweile auch per CSS3-Transitions gestalten. Damit erspart man sich die Mittel Javscript/jQuery.
Hier dazu ein ausführlicher Artikel vom Smashing Magazine dazu (englisch):
http://coding.smashingmagazine.com/2012/04/25/pure-css3-cycling-slideshow/ -
in: Microsoft Security Essentials
geschrieben von cyclobox
Ein Virus, der von einem Virenscanner einfach und zuverlässig entfernt werden kann stellt ja auch keine Gefahr dar. Man kann sich aber heute nicht mehr sicher sein, dass die Virenscanner auf dem Level arbeiten, wie es möglich wäre. Wenn ich die ganzen Nachrichten immer lese, dass Virenscanner XY wieder bestimmte Systeme lahm legt oder sich selbst in Quarantäne verschieben will, dann traue ich solchen Dingern eben nicht mehr so vollends. -
in: Microsoft Security Essentials
geschrieben von cyclobox
kelserific hat vollkommen Recht.
Die meisten Antivirenhersteller haben ein ureigenes Interesse daran, dass eure Systeme eben NICHT sicher sind. Sonst würd wohl kaum so eine große Nachfrage bestehen. Ein kostenloser AntiVirus von Avira & Konsorten langt völlig aus und ist nicht schlechter als Snake-Oil-Kaspersky oder -Semantec.
Ein Antivirensystem kann ohnehin nicht viel mehr, als zu erkennen, dass da womöglich ein Virus sein Unwesen treibt. Zuverlässig entfernen muss man ihnen selber. Da ist dann auch jeder Virus wieder anders und unterschiedlich komplex.
Wer sicher sein will, muss sich auch sicher verhalten. Browserextensions wie NoScript oder ClickToPlay für Flashplugins sind schon mal ein Anfang, um mögliche Gefahrenquellen auszuschließen. -
in: News Rotator
geschrieben von cyclobox
Slideshow ist hier wohl der treffende Begriff und dazu findet man ziemlich viel im Web, da das grade ziemlich modern zu sein scheint.
Eine abgewandelte Form wäre es für jeden Menüpunkt ein solches Bild zu hinterlegen, welches dann im Header, o.ä. angezeigt wird, wenn man auf der entsprechenden Seite ist. -
in: Wordpress: Hauptindex-Template (index.php) verbessern
geschrieben von cyclobox
@daswing:
Deine Vorschläge schaue ich mir jetzt an. Meine Intention war es zunächst die Seite so zu gestalten, wie sie jeder mindestens zu sehen bekommt, um anschließend optionale CSS3-Spielereien einzubauen. Eben wie Transitions, Gradienten, und alle die schönen Dinge. Aber das Bild sieht schon ziemlich gut aus.
In den Footer soll später eine Art Sitemap bzw. Impressum/Claim/Disclaim und solche Sachen. Die Navigation ist auch momentan noch obligatorisch.
CSS-Gradient in der Navigation. Ich hab noch irgendwie die anderen Gradient-Syntax-Varianten unterzubringen nachgeahmt. Weiterhin hab ich box-shadow beim Wrapper übernommen. Die einzelnen Menüelemente haben jetzt außerdem Transition und Schatten, den aber nur oben.
#wrapper{ width:960px; margin:0 auto; background-color:#fff; box-shadow: 0 0 10px #000; } (...) nav{ background-color:#111; background:-webkit-gradient(linear, left top, left bottom, from(#333), to(#000)); background:-webkit-linear-gradient(top, #333, #000); background:-moz-linear-gradient(50% 80% 90deg, #000000, #333333 100%) repeat scroll 0 0 transparent; background:-ms-linear-gradient(50% 80% 90deg, #000000, #333333 100%) repeat scroll 0 0 transparent; background:-o-linear-gradient(50% 80% 90deg, #000000, #333333 100%) repeat scroll 0 0 transparent; background:linear-gradient(50% 80% 90deg, #000000, #333333 100%) repeat scroll 0 0 transparent; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#000000'); /* IE6 & IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#000000')"; /* IE8+ */ border-bottom:3px solid #e00000; } nav a{ -webkit-transition:All 0.3s ease-in-out; -moz-transition:All 0.3s ease-in-out; -ms-transition:All 0.3s ease-in-out; -o-transition:All 0.3s ease-in-out; transition:All 0.3s ease-in-out; display:block; float:left; padding:10px 30px; color:#fff; } nav a:hover{ background-color:#e00000; box-shadow: 0 10px 10px -10px #550000 inset; }
ploco schrieb:
Ich glaube das post_nav_link die erwünschte Funktion liefern sollte.
Allgemein würde ich dir empfehlen, bei deinen Links das title-Attribut zu verwenden und da du ohnehin auf HTML5 zurückgreifst, würde es sich anbieten, das time-Tag einzusetzen.
Grüße Maik
@Maik:
Ich habe mich mit dieser Funktion beschäftigt und herausgefunden, dass diese intern lediglich die selben Funktionen aufrufen wie ich. Ich hab mich jetzt noch ein wenig umgesehen und folgende Lösung implementiert:
Zu beachten ist jetzt, dass ich im Backend pro Seite nur einen Artikel anzeige, damit man sehen kann, wie das Ganze live aussieht.
Auszug aus der index.php
<?php if (show_posts_nav()) : ?> <div id="page-navigation"> <p class="newer-entries"><?php previous_posts_link('« Neuere Einträge'); ?></p> <p class="older-entries"><?php next_posts_link('Ältere Einträge »'); ?></p> <div class="clear"></div> </div> <?php endif; ?>
CSS zum formatieren der Links:
section #page-navigation{ width:50%; margin:3em auto 0; } section #page-navigation .older-entries{ float:right; } section #page-navigation .newer-entries{ float:left; } section #page-navigation a{ color:#e00000; text-decoration:none; } section #page-navigation a:visited{ color:#be0000; } section #page-navigation a:hover{ color:#000; text-decoration:underline; }
Funktion in der functions.php, die nur WAHR zurückliefert, wenn es mehr als 1 Seite gibt:
function show_posts_nav() { global $wp_query; return ($wp_query->max_num_pages > 1); }
Hier noch eine Frage zur Seitenstruktur:
Momentan floate ich sowohl den Contentbereich (umfasst mit dem Element section - float:left), als auch die Sidebar (aside - float:right). Dadurch muss ich eine feste Breite vergeben, damit sie so angezeigt werden, wie gewünscht.
Wenn ich jetzt aber ein Template verwenden will, bei dem die Sidebar garnicht angezeigt werden soll, dann ist section dennoch nur so breit, als wäre noch eine Sidebar da. Klar, weil es ja eine feste Breite hat.
Ergo wäre es sinnvoller, wenn section nicht floatet und somit immer den maximal verfügbaren Platz nimmt. Dann habe ich aber das Problem, dass es zwar den maximal verfügbaren Platz nimmt, bei Anzeige einer Sidebar diese aber auch nach unten verdrängt.
Wie kann ich diese Zwickmühle lösen? Ich möchte ungern die Sidebar vor dem Content rendern lassen.
Und noch eine Frage:
Wenn mein Footer keine fixe Höhe hat, dehnt er sich natürlich gemäß seines Inhalts aus. Allerdings gilt das nicht für margin-bottom, den Kindelemente des Footers eventuell haben (z.B. durch UL). Der Abstand dehnt also die Höhe des Footers nicht weiter aus, sondern sorgt für einen unschönen Abstand am unteren Ende.
Durch probieren habe ich festgestellt, dass ich das lösen kann, in dem ich entweder dem Footer einen border-bottom verpasse oder overflow:hidden zuweise. Warum das allerdings dadurch behoben wird und was das "behoben" wird ist mir unklar. Weiß jemand den Grund?
Die Antwort scheint das Prinzip der "Collapsing Margins" zu sein. Möglich Lösung sind die Vergabe eines Rahmens, 1px-Padding oder overflow-Wert außer visible. -
in: Wordpress: Hauptindex-Template (index.php) verbessern
geschrieben von cyclobox
Oh selbstverfreilich, ich dachte das wäre offensichtlich. Mein Webspace dieses Accounts:
http://cyclobox.lima-city.de/ -
in: Wordpress: Hauptindex-Template (index.php) verbessern
geschrieben von cyclobox
Hallihallo,
Ich arbeite mich gerade per lima-city Webspace in Wordpress ein und hab mir ein eigenes Theme von Grund auf neu erstellt.
Das lief bisher alles recht eingängig, aber freilich gab es schon manchmal Fragen, die nicht sofort eingeleuchtet sind.
Ich hab zwar etliche Ansätze verfolgt, ausprobiert und wieder verworfen und selbstverständlich gibt es zu diesem Thema mehr als genug Stuff, den man sich im Internet dazu besorgen kann, aber mir ist die Diskussion lieber.
Was kann man an meinem Template für meine index.php noch verbessern bzw. korrigieren (und dann demzufolge auf page.php, etc. übertragen)
<?php get_header(); ?> <section role="main"> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2> <div class="meta"> <p>am <?php echo get_the_date(); ?> um <?php echo get_the_time(); ?> Uhr von <a href="<?php echo get_author_posts_url(get_the_author_meta( 'ID' )); ?>"><?php the_author(); ?></a></p> </div> <div class="entry"> <?php the_content(); ?> </div> <div class="meta"> <p>Kategorie: <?php the_category(', '); ?> - <?php comments_number( 'keine Kommentare', '1 Kommentar', '% Kommentare' ); ?></p> </div> </article> <?php endwhile; ?> <?php $prev_link = get_previous_posts_link(__('« Neuere Einträge')); $next_link = get_next_posts_link(__('Ältere Einträge »')); if ($prev_link || $next_link) { echo '<p id="post-navigation">'; if ($prev_link){ echo $prev_link; } if ($prev_link && $next_link) { echo ' | '; } if ($next_link){ echo $next_link; } if ($prev_link || $next_link) { echo '</p>'; } } ?> <?php endif; ?> </section> <?php get_sidebar(); ?> <?php get_footer(); ?>
Ich bin mir vor allem hinsichtlich des Loops nicht sicher und ob man nicht das Erstellen der Seitennavigation am Ende einfacher und besser gestalten könnte. -
in: iPod Touch: Leistung nimmt massiv ab
geschrieben von cyclobox
lush schrieb:
Bei Apple hat man ab Kaufdatum 3 Jahre lang Garantie.
Ansonsten schließe ich mich er Frage an, habe das selbe Problem.
Das stimmt nicht. In der EU halten die sich weder an die "2-Jahres-Garantie Norm", noch an die einheitlichen Stecker für Ladekabel. -
in: Hintergrundbild auf Webseite
geschrieben von cyclobox
tobiworlds schrieb:
(...) background-image: url("pfadZumBild") fixed no-repeat; (...)
Bei deinem Code darfst du nur background schreiben, wegen der Kurzschreibweise. Hatte eben den selben Fehler gemacht. ;) -
in: Hintergrundbild auf Webseite
geschrieben von cyclobox
Das hat mehr etwas mit HTML bzw. CSS zu tun, will heißen du bist hier im falschen Forum gelandet. :p
CSS-Code:
body{ background-image: url('images/background.png'); background-attachment: fixed; }
Zwischen die Klammern kommt die Pfadangabe zu dem Bild. Du kannst auch auf eine andere Internetseite verweisen, wo das Bild dann liegt.
Die Angabe background-attachment: fixed; gibt an, dass sich das Hintergrundbild nicht mitscrollt. -
in: DIV-Container über anderen wachsen lassen
geschrieben von cyclobox
In deinem Beispiel ist sowas jeweils einmal bei einem Artikel zu sehen. Man kann also grob von einer solchen Struktur ausgehen. Wenn der umgebende DIV-Container position:relative hat kann man Kindelemente dieses Containers abhängig von dessen Position per position:absolute positionieren.
Weiterhin ist auch die Möglichkeit mit negativen margin-left möglich, wie bereits erwähnt. Dabei musst du dann aber bedenken, dass die größe diese zu verschiebenden Elements noch in dem "Textfluss" des Containers berücksichtigt werden muss.
<div id="content"> <div class="article" style="position:relative;"> <div class="meta" style="position:absolute; left:-20px;"> <p>2009<br /> 17.12</p> </div> <div class="entry"> <!--post content--> </div> </div> <div class="article" style="position:relative;"> <div class="meta" style="position:absolute; left:-20px;"> <p>2009<br /> 17.12</p> </div> <div class="entry"> <!--post content--> </div> </div> </div>
Hier veranschaulicht als simple HTML-Seite:
http://cyclobox.lima-city.de/examples/positionierung.html -
in: .php Endung ausblenden
geschrieben von cyclobox
Meinst du es so, dass in der Adresszeile eines Browsers beispielsweise nur url.tld/about steht und nicht url.tld/about.php?
Mir fällt auch kein Szenario ein, wo das sinnvoll wäre. Ist es nämlich nicht. -
in: Bild schärfen
geschrieben von cyclobox
Bilder automatisch schärfen zu lassen ist an sich schon Käse. Das ist als würd ich sämtliche Speisen vor dem Verzehr eigenhändig ohne Vorkosten würzen, ohne zu wissen, ob die nicht schon gewürzt worden sind. -
in: I Pod Touch Jailbreaken Legal oder nicht Legal?
geschrieben von cyclobox
Nichts anderes hab ich gesagt.
Einschicken mit Jailbreak - kein Garantiefall.
Einschicken nach Wiederherstellung - Garantiefall möglich. -
in: I Pod Touch Jailbreaken Legal oder nicht Legal?
geschrieben von cyclobox
untethered Jailbreak ist seit kurzer Zeit draußen.
Weiterhin verliert man nicht die Garantie, wenn man über iTunes wiederherstellt. Das steht oben aber bereits. -
in: I Pod Touch Jailbreaken Legal oder nicht Legal?
geschrieben von cyclobox
ist rechtlich nicht definiert.
Wenn du den iPod nach einem Jailbreak über iTunes wiederherstellst, weil du ihn einschicken musst, kann man dir das nicht nachweisen. Meinen iPod hab ich auch gejailbreaked. -
in: Fritz!Box 7390 nahm falsches WLAN-Passwort an
geschrieben von cyclobox
Kann es vielleicht sein, dass es auch bei Routern eine Art Session gibt, die sich merkt, wer wie grad verbunden ist und diese Session noch auf dem alten Passwort basierte?
Abgesehen davon müsste man extra einprogrammieren, dass eine Software ein Passwort trotz falschen Buchstaben annimmt. Das halte ich bei einem solchen Gerät für ziemlich unwahrscheinlich.
Letzte Möglichkeit. Es war eine 1 und du hast im Notepad ein l draus gemacht? -
in: Ungültige Nummer : font / ist kein font-family-Wert
geschrieben von cyclobox
Die Verwendung von 100.01% als ausgehende Schriftgröße vermeidet Rundungsfehler beim Internet Explorer. Theoretisch wären auch 100% möglich, freilich.
Zurück zum Thema: Ich habe noch ein bisschen weiter geforscht. Das ist ein bekannter Bug im W3C-Validator, welcher mit dem Schrägstrich nicht umgehen kann.
Verwende also zur "korrekten Validierung" nur die Kurzschreibweise ohne "/24px" und definiere extra "line-height:24px". -
in: Lima-Minecraft-City Server (offline)
geschrieben von cyclobox
waitinghill schrieb:
nachdem ich mich ersma schlau gemacht habe was "Minecraft" überhaupt ist, denke ich mal das ist eine gute idee.
mal schauen wie sich das entwickelt
Na da hast du aber im letzten Jahr ganz schön unter einem Stein gehaust, was?
Ich werde mich bei Zeit auch mal umtun. -
in: Ungültige Nummer : font / ist kein font-family-Wert
geschrieben von cyclobox
Bei mir sieht eine Font-Definition so aus:
font:100.01%/1.4 "Lucida Sans Unicode", "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;
100.01% ist die relative Schriftgröße im Verhältnis zu dem, was im Browser eingestellt ist. Meistens sind das 16 px.
Hinter dem Schrägstrich dann die Angabe zur Zeilenhöhe. Ohne Einheit verhält sich diese wie ein Faktor, also ist meine Zeilenhöhe das 1.4-fache von der Schrifthöhe.
Weiterhin habe ich etliche Schriften definiert. Lucida Sans Unicode von Windows ist das Equivalent zu Lucida Grande von Mac OS. Es sind also beide definiert, dass die Seite auf beiden Betriebssysteme nahezu ähnlich aussieht.
Die anderen Schriften sind hinterlegt, für den Fall, dass die weiter vorn stehenden nicht auf dem Rechner installiert sind.
Zum eigentlichen Problem:
In deinem Quelltext verwendest du VOR deiner font-Deklaration auch die Kurzschreibweise background. Die ist falschund deswalb werden alle restlichen für body festgelegten Eigenschaften ignoriert.
background: url(../grafiken/body.png) top repeat-x #f3f1e9;
Die Farbdefinition muss noch vor der Angabe des Hintergrundbildes erfolgen. So ist es richtig:
background:#f3f1e9 url(../grafiken/body.png) top repeat-x;
PS: Der Validator ist nicht darauf ausgelegt solche Spezifitäten zu erkennen. Es ist auch klar festgelegt, dass solche Validatoren nur eine erste Maßnahme zum überprüfen des Quellcodes sind. -
in: Objekt vertikal zentrieren
geschrieben von cyclobox
So, ich habe hier noch einen Artikel, der dir definitiv weiterhelfen wird:
http://designshack.net/articles/css/how-to-center-anything-with-css/ -
in: Homepage Performance
geschrieben von cyclobox
Ich muss aber auch sagen. Dein Quellcode lässt wirklich massiv zu wünschen übrig. Zu mal man ihn nach ein paar Zeilen einfach nicht mehr lesen kann, weil alle Zeilenumbrüche, Tabulatoren, etc. fehlen.
Weiterhin hab ich mal hier geschaut: http://sve-badminton.de/series-collection/
"made for firefox! other browsers won't work" Bitte was? O.o -
in: iPod Touch: Leistung nimmt massiv ab
geschrieben von cyclobox
Ein klassischer Fall von "Einen Neustart schon probiert?". Neustart des iPods: ca. 5 Sekunden die Standby-Taste halten und dann denn riegel rüber schieben, wenn die Ausschalten-Meldung kommt. -
in: Kennt jemand einen GUTEN HTML Editor
geschrieben von cyclobox
(Text-)Editoren gibt es wie Sand am Meer. Es kommt natürlich darauf an, was du alles machen willst. Wie viel der können soll etc.
Bereits erwähnt, aber hier noch mal: Notepad++
Dieser Editor ist sehr leistungsfähig und unterstützt zunächst mal das praktische Syntax Highlighting. Das ist gerade für Anfänger eine gute Stütze, um den eigenen Code besser lesen zu können. Da werden die verschiedenen Bestandteile von beispielsweise HTML oder CSS Code farblich hervorgehoben, so dass man zum Beispiel erkennen kann, ob das gerade eine Klasse oder eine ID ist, usw.
Notepad++ kann aber auch noch viel mehr. Lad ihn dir einfach mal runter und spiele damit.
Sachen wie Dreamweaver, NVU oder Phase 5 sind für den Anfang aber keine gute Wahl, da diese "mehr" machen, als einen guten Editor zu liefern. Mit solchen Tools kann man Webseiten nach dem Baukastenprinzip zusammenstöpseln und was dabei rauskommt ist meistens alles andere als sauberer Code. Zu mal man natürlich dann auch kein richtiges Basiswissen benötigt, um HTML, CSS, usw. zu verstehen. -
in: Strg+U blockieren
geschrieben von cyclobox
Zum Thema HTML5 sei noch gesagt, dass man da auch noch weitere Dinge zwecks Abwärtskompatibilität zu älteren Internet Explorer Versionen vornehmen muss.
Für dich ist es also sinnvoll erst einmal zu versuchen dein Dokument valide mit dem Doctype "strict" zu schreiben. Das gute bei diesem Thema ist, dass es nicht wie bei richtiger Programmierung unterschiedlichen Sprachen für ein und den selben Zweck gibt (Man kann ja zum Beispiel mit C++, Delphi oder Java programmieren - im Web gibt es für alle Aufgaben eine bestimmte, etablierte Technik).
Das bedeutet, dass es im World Wide Web wirklich tonnenweise Informationen, Tipps, Tricks, Guides, Tutorials und whatnot gibt, die einem bei der Einarbeitung helfen.
Wie bei vielen anderen Dingen auch, gilt auch: Man lernt nie aus. Darum lass den Kopf nicht hängen, es ist noch kein Meister vom Himmel gefallen. Kleine Erfolge führen zum Ziel. -
in: Minecraft Error. Spiel startet nicht.
geschrieben von cyclobox
Versuche mal folgendes:
- deinstalliere deine Javaversion
- Lade dir eine neue runter (32 Bit)
- installiere diese, indem du sie über Rechtsklick > Als Administrator ausführen startest -
in: Minecraft Error. Spiel startet nicht.
geschrieben von cyclobox
Hast du ein 64-Bit Betriebssystem? Welche Java-Version hast du? Hast du Java als Administrator installiert? -
in: Strg+U blockieren
geschrieben von cyclobox
Allein schon eine erfolgreiche Validierung eines Dokuments mit dem Doctype Loose als fehlerfrei zu bezeichnen ist lächerlich.
Wenn du nicht willst, dass jemand Zugriff auf deine Website hat, dann betreib sie lokal daheim unter einem Stein.
Andernfalls musst du deinen Quelltext offenlegen, sonst widerspricht die Seite allem, was als "gute Praxis" in dieser Materie angesehen wird. -
in: CSS für <img ... align="absmiddle" ...>
geschrieben von cyclobox
menschle schrieb:
plugboard schrieb:
^^ Alte Methode, und immer noch in allen gängigen Browsern üblich:
ich möchte ein Bild in einem Text absolut mittig ausrichten
text-align: center;
Und lasst euch nicht täuschen:
Auch wenn es sich offensichtlich nur auf Text bezieht, sind gewisse Images miteinbezogen.
;)
text-align bezieht sich sowohl auf normale Inline-Elemente wie Textabsätze, Verweise, etc. als auch auf Inline-Block-Elemente, wie Bilder. Darum geht text-align auch bei Bildern, die per img-Element eingebunden sind.
Hintergrundbilder sind wieder eine andere Geschichte.
Weiterhin glaube ich, dass er nicht die horizontale, sondern vertikale Ausrichtung eines Bilders meint. -
in: Dnb und Dubstep eine Modeerscheinung?
geschrieben von cyclobox
Wie mit House ist es auch bei Dubstep so, dass sich das, was man als Normalsterblicher davon zu hören bekommt sehr weit von dem entfernt, worum es bei dieser Musik im ursprünglichen Ging.
Housemusik aus den 90ern ist mit dem, was die Kids heute darunter verstehen absolut nicht vergleichen - aber der Begriff wird dafür nun mal verwendet. Genau wie Dubstep für das, was Leute wie Skrillex und die ganzen aktuellen Chartpüppchen veranstalten.
Alles was dann ein wenig ruhiger ist, ist dann schon wieder Minimal Techno. Oder doch nicht?
Wer soll da noch durchblicken. Musik lässt sich bei der riesigen Vielfalt und Quantität, aber auch Qualität nicht mehr einwandfrei einordnen. Es gibt Tausende und Abertausender Unter-, Zwischen- und Wassonstnichtfür-Kategorien, da sollte man sich einfach darauf verstehen, was man gerne hört und das jeder einen Geschmack hat. Ob er einem passt oder nicht.
PS: Fröhliche Beats für alle! -
in: div richtig anordnen - wie gehts richtig?
geschrieben von cyclobox
Das habe ich auch so verstanden. Ich wollte viel mehr darauf hinweisen, dass eben dieses verhalten nicht immer sinnvoll ist.
Als Beispiel seien da Landschaften oder Portraits im Header bzw. als Seitenhintergrund genannt, bei denen das Seitenverhältnis wichtig, so dass es nicht "komisch" aussieht.
Zugegeben, mein Kommentar war ein wenig Offtopic, es ist daher eher als weiterführender Hinweis zu diesem Thema zu verstehen. ;) -
in: Favicon mit CSS festlegen
geschrieben von cyclobox
Man muss übrigens nicht unbedingt im Head-Bereich angeben, dass man ein Favicon hat. Alle modernen Browser suchen bei Nichtvorhandensein einer entsprechenden Metaangabe zunächst das Verzeichnis der aufgerufenen Datei nach einer "favicon.ico"-Datei ab und danach auch das Hauptverzeichnis der Internetadresse.
Mit der Metaangabe ist es allerdings möglich auch ein weitere Formate für das kleine Bildchen zu verwenden. Zum Beispiel eine .PNG-Datei. -
in: Objekt vertikal zentrieren
geschrieben von cyclobox
Blockelemente vertikal zu zentrieren ist wie ihr festgestellt habt nicht so einfach. Das liegt daran, dass es einfach nicht vorgesehen ist.
eine Möglichkeit ist es, ein solches Element innerhalb einer Tabelle vertikal zu zentrieren, diese Technik entspricht aber nicht der Philosophie dessen, wie man guten, sauberen Code schreibt und ist daher als depracated eingestuft.
Weiterhin ist vertical-align dafür da Inline- und Inlineblock-Elemente auszurichten. Man könnte zum Beispiel innerhalb eines Absatzes ein Wort ober an der Zeile ausrichten und ein anderes in der Mitte, anstatt auf der sogenannten Grundlinie.
Die Grundlinie ist die Linie in einer Zeile, auf der alle Buchstaben stehen außer die kleinen Buchstaben j, q, p und g, da sie noch ein paar Pixel nach unten Ragen. Auch Bilder in einem Absatz kann man so unterschiedlich Ausrichten. Mit DIV-Containern oder anderen Blocks geht das nicht.
Die einfachste Möglichkeit ist, wie von viele hier schon vorgeschlagen ein negativen Abstand zu dem umgebenden Elternelement zu schaffen. Eine 100% mittige Position kann man so aber so gut wie nie erreichen, es sei denn man hat von allem die fixen Höhen und rechnet auch die größe des zu zentrierenden Objekts mit ein. -
in: div richtig anordnen - wie gehts richtig?
geschrieben von cyclobox
der-kay schrieb:
Das stimmt so nicht ganz. Ein Hintergrund kann sich mit der Eigenschaft background-repeat:repeat; kachelnd wiederholen und sich so auf die Größe seines Containers ausdehnen. Mit background-repeat:no-repeat; kann man ein Hintergrundbild aber zum Beispiel auch nur ein anzeigen. Es vergrößert sich dann nicht auf die Größe des Div-Containers.
Ja, das ist richtig, aber ich meinte das Bild solle mit <img> in den Container, damit man ihm per width und height (je 100%) sagen kann, dass es immer den verfügbaren Platz des Containers einnehmen soll.
Meines Wissens nach (korrigiert mich, wenn ich da falsch liege) ändern sich die Abmaße eines Bildes das einem DIV per Background-Image zugewiesen wurde, beim resizen des Fensters nicht.
Diesem trägen Verhalten könnte man mit der <img> Variante relativ leicht aus dem Weg gehen.
Stimmt, Backgroundbilder ändern sich nicht in ihrer Größe beim "Ziehen" des Fensters oder ähnlichem.
Es stellt sich allerdings die Frage, wie sinnvoll es ist ein Bild vom Browser in der Größe verändern zu lassen. Bei Gradienten, Farbverläufen und ähnlichem kann ich mir das aber noch vorstellen. -
in: HTML 5 Lernen?
geschrieben von cyclobox
Im Prinzip kommst du in dieser Marterie nicht darum, dich auch mit teils veralteten Dingen wie HTML 4.x, etc. zu befassen, da du nur so Einblicke in bestimmte Bereiche dieses Themas erhältst, die mitunter sehr wichtig sind.
HTML 5 beinhaltet nicht nur die Neuerungen, Erweiterungen, Fixes, etc. die neu dazugekommen sind, sondern auch alles aus älteren HTML-Versionen und XHTML, was noch als "gut" eingestuft ist. Es ist sozusagen abwärtskompatibel. Das ist ja nichts völlig neues und eigenständiges.
In diesem Zusammenhang musst du dich dann natürlich auch mit CSS befassen. HTML (welche Version auch immer) ist dafür da, eine Seite zu strukturieren, ein Grundgerüst zu schaffen und den Inhalt darin unterzubringen. Gestaltet wird dann komplett über CSS. Das ist auch der Grund, warum nicht mehr Elemente wie i, b und u-Tags verwendet werden sollten. Diese enthalten schon gestalterische Vorgaben über das Aussehen eines so umschlossenen Textes. Stattdessen wird empfohlen auch das über CSS zu regeln. -
in: div richtig anordnen - wie gehts richtig?
geschrieben von cyclobox
der-kay schrieb:
Wenn deine Klasse z.B. #menu heißt dann würde der Code bzw. das Gerüst erstmal so aussehen:
#menu:hover{};
Vorsicht, Klassen werden in CSS mit einem vorangestellten Punkt angesprochen. #menu wäre eine ID.
der-kay schrieb:
Dein Logo ist nicht per <img> eingebunden (dann würde es in dem Container liegen), sonder es ist der Hintergrund des Containers (background-image). Das Hintergrundbild ist immer genauso groß, wie der Container dem es zugewiesen wurde.
Das stimmt so nicht ganz. Ein Hintergrund kann sich mit der Eigenschaft background-repeat:repeat; kachelnd wiederholen und sich so auf die Größe seines Containers ausdehnen. Mit background-repeat:no-repeat; kann man ein Hintergrundbild aber zum Beispiel auch nur ein anzeigen. Es vergrößert sich dann nicht auf die Größe des Div-Containers.
der-kay schrieb:
Ist vielleicht 'n Bisschen hart, aber man kann viele Dinge mit HTML-Editoren wie Dreamwaver machen.
Spätestens wenn es dann aber an's Anpassen von Designs geht, braucht man wenigstens HTML uns CSS-Kenntnisse, also nicht böse sein, wenn das nicht die erhofte Hilfe war.
Zum Thema HTML-Editoren muss ich dir allerdings zustimmen. Will man in diese Marterie einsteigen und etwas lernen, dann kommt man nicht darum die Grundlagen, die sehr wichtig sind, zu lernen und zu verstehen. Gerade, wenn es darum geht, wie sich Klassen und IDs nutzen lassen, wie man Container positioniert und sie sich entsprechend verhalten und nicht zuletzt wie man sauberen Quellcode schreibt. -
in: Homepage Performance
geschrieben von cyclobox
Die Bilder die du da als Icons verwendest könnten auch auf (zu) große Bilddateien verweisen und nur per width und height verkleinert worden sein, dass muss dann ja auch alles in der Originalgröße geladen werden bei so vielen Bildern. Man sieht aber dann eigentlich, dass das "Aufbauen" der Icons von oben nach unten dauert und zu einzelnen Verzögerungen beim Laden dieser kommt.
Wenn es sich um "echte" Ruckler handelt, als ob z.B. der Browser kurz einfriert, dann hat das ziemlich sicher nichts mit dem HTML/CSS zu tun, sondern viel mehr mit Gründen, die die Vorposter schon aufgezeigt haben: PC-Performance und Javascriptsachen, u.ä. -
in: CSS für <img ... align="absmiddle" ...>
geschrieben von cyclobox
Nach meinem Wissen sollte die CSS-Eigenschaft vertical-algin (!) schon das machen, was du wünscht. Das Attribut valign von Tabellen wurde früher gerne in Verbindung mit Tabellenlayouts verwendet (missbraucht *hust*) und hat mit der CSS-Eigenschaft nur indirekt zu tun.
Ich benötige vertical-align zum Beispiel in meinem Bloglayout um die Bilder nicht auf "baseline" sondern "bottom" auszurichten, um unschönen Extrarand nach unten zu vermeiden.
vertical-align ist aber nicht dafür da, echte Blockelemente wie DIV-Container auszurichten. Mit Inlineblocks wie img-Elementen sollte es gehen.
Falls du des Englischen mächtig genug bist ist hier noch ein interessanter Artikel dazu:
phrogz.net - Understanding vertical-align
PS: Bilder in einem Text sind in der Regel nicht als Hintergrund des jeweiligen "Eltern-Blocks" definiert - die Eigenschaft background-position: 50% 50%; dürfte in diesem Fall also nicht weiterhelfen. Oder willst du das etwa genau so? Dann sei es mir verziehn. ;)
