{"id":242,"date":"2010-02-28T12:42:49","date_gmt":"2010-02-28T12:42:49","guid":{"rendered":"http:\/\/frank-it-beratung.com\/?p=242"},"modified":"2013-07-09T07:02:46","modified_gmt":"2013-07-09T07:02:46","slug":"bugfix-fur-wordpress-theme-mistylook-durch-css-trick","status":"publish","type":"post","link":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/","title":{"rendered":"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick"},"content":{"rendered":"

F\u00fcr kleine Blogprojekte setzte ich sehr gerne das nett gemachte WordPress Theme \u201eMistyLook\u201c von Sadish<\/a> ein. Leider hat dies einen kleine Bug: Verwendet man Bilder-Galerien, so wird der Schatten-Effekt durch ein Link-Border \u00fcberdeckt, was ziemlich h\u00e4sslich aussieht. M\u00f6chte man dies mit dem CSS User-Stylesheet Editor von WordPress beheben, steht man vor einem Problem. F\u00fcgt man<\/p>\n

div #gallery-1 img { border-width:0px; }<\/p><\/blockquote>\n

ein, so bringt das leider gar nichts: Das CSS f\u00fcr die Gallery wird (vereinfacht gesprochen) erst nach dem User- und Theme-Stylesheet geladen und \u00fcberschreibt so dies. Folgendes einfaches Beispiel illustriert das Problem:<\/p>\n

<head>
\n<title>Test<\/title>
\n<style><\/p>\n

\/* Style 1: *\/
\ndiv #meintext strong { color:red; }<\/p>\n

\/* Style 2 (nicht \u00e4nderbar): *\/
\ndiv #meintext strong { color:green; }<\/p>\n

<\/style><\/head><\/p>\n

<body>
\n<div>
\n<span>Hallo <strong>Welt<\/strong><\/span>
\n<\/div>
\n<\/body><\/p><\/blockquote>\n

Die kleine R\u00e4tselaufgabe: Sie m\u00f6chten, dass das Wort \u201eWelt\u201c rot dargestellt wird, d\u00fcrfen jedoch weder die Definition \u201eStyle 2\u201c noch den HTML-Quelltext sondern nur die Zeile nach \u201eStyle 1\u201c ver\u00e4ndern. Geht das?<\/p>\n

Bisher dachte ich, dass das nicht geht und habe immer tief in den WordPress-Code eingeriffen, um die Reihenfolge der CSS-Sheets zu \u00e4ndern. Aber neulich kam die Erleuchtung:\u00a0Es geht doch. Dennn bei der Vererbung werden Definitionen, die auf h\u00f6herer Ebene ansetzten, nicht \u00fcberschrieben. Folgendes CSS stellt also das Wort \u201eWelt\u201c rot dar:<\/p>\n

\/* Style 1: *\/
\nbody div #meintext strong { color:red; }<\/p>\n

\/* Style 2 (nicht \u00e4nderbar): *\/
\ndiv #meintext strong { color:green; }<\/p><\/blockquote>\n

Daraus ergibt sich folgender CSS-Code f\u00fcr den Bug in dem WordPress-Theme \u201eMistyLook\u201c:<\/p>\n

#content .entry a:link,#content .entry a:visited {
\nborder-bottom-size:0;
\n}<\/p>\n

body div #gallery-1 img {
\nborder-width:0;
\n}<\/p>\n

body div #gallery-2 img {
\nborder-width:0;
\n}<\/p>\n

\/*… *\/<\/p>\n

body div #gallery-9 img {
\nborder-width:0;
\n}<\/p><\/blockquote>\n

Sicherlich g\u00e4be es noch andere M\u00f6glichkeiten, aber diese ist wohl relativ einfach und unkompliziert.<\/p>\n","protected":false},"excerpt":{"rendered":"

F\u00fcr kleine Blogprojekte setzte ich sehr gerne das nett gemachte WordPress Theme \u201eMistyLook\u201c von Sadish ein. Leider hat dies einen kleine Bug: Verwendet man Bilder-Galerien, so wird der Schatten-Effekt durch ein Link-Border \u00fcberdeckt, was ziemlich h\u00e4sslich aussieht. M\u00f6chte man dies … Weiterlesen →<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[6,16,22],"tags":[73,44,85],"class_list":["post-242","post","type-post","status-publish","format-standard","hentry","category-css","category-programmierung","category-wordpress","tag-css","tag-mistylook","tag-wordpress"],"yoast_head":"\nBugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick - Socialweb Dev-Blog \/\/ Frank-IT-Beratung<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick - Socialweb Dev-Blog \/\/ Frank-IT-Beratung\" \/>\n<meta property=\"og:description\" content=\"F\u00fcr kleine Blogprojekte setzte ich sehr gerne das nett gemachte WordPress Theme \u201eMistyLook\u201c von Sadish ein. Leider hat dies einen kleine Bug: Verwendet man Bilder-Galerien, so wird der Schatten-Effekt durch ein Link-Border \u00fcberdeckt, was ziemlich h\u00e4sslich aussieht. M\u00f6chte man dies … Weiterlesen →\" \/>\n<meta property=\"og:url\" content=\"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/\" \/>\n<meta property=\"og:site_name\" content=\"Socialweb Dev-Blog \/\/ Frank-IT-Beratung\" \/>\n<meta property=\"article:published_time\" content=\"2010-02-28T12:42:49+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2013-07-09T07:02:46+00:00\" \/>\n<meta name=\"author\" content=\"Simon A. Frank\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"Simon A. Frank\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"2\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/\"},\"author\":{\"name\":\"Simon A. Frank\",\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/#\\\/schema\\\/person\\\/e31d0c55b9277739ef6c87d5e7bb47a2\"},\"headline\":\"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick\",\"datePublished\":\"2010-02-28T12:42:49+00:00\",\"dateModified\":\"2013-07-09T07:02:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/\"},\"wordCount\":319,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/#\\\/schema\\\/person\\\/e31d0c55b9277739ef6c87d5e7bb47a2\"},\"keywords\":[\"CSS\",\"MistyLook\",\"WordPress\"],\"articleSection\":[\"CSS\",\"Programmierung\",\"WordPress\"],\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/\",\"url\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/\",\"name\":\"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick - Socialweb Dev-Blog \\\/\\\/ Frank-IT-Beratung\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/#website\"},\"datePublished\":\"2010-02-28T12:42:49+00:00\",\"dateModified\":\"2013-07-09T07:02:46+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/2010\\\/02\\\/28\\\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Startseite\",\"item\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/\",\"name\":\"Socialweb Dev-Blog \\\/\\\/ Frank-IT-Beratung\",\"description\":\"Social-Media und Web-Entwicklung: Tutorials und Tipps von Simon A. Frank\",\"publisher\":{\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/#\\\/schema\\\/person\\\/e31d0c55b9277739ef6c87d5e7bb47a2\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/#\\\/schema\\\/person\\\/e31d0c55b9277739ef6c87d5e7bb47a2\",\"name\":\"Simon A. Frank\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/frank-it-beratung.de\\\/blog\\\/wp-content\\\/uploads\\\/2009\\\/09\\\/simon200x200.jpg\",\"url\":\"https:\\\/\\\/frank-it-beratung.de\\\/blog\\\/wp-content\\\/uploads\\\/2009\\\/09\\\/simon200x200.jpg\",\"contentUrl\":\"https:\\\/\\\/frank-it-beratung.de\\\/blog\\\/wp-content\\\/uploads\\\/2009\\\/09\\\/simon200x200.jpg\",\"width\":200,\"height\":200,\"caption\":\"Simon A. Frank\"},\"logo\":{\"@id\":\"https:\\\/\\\/frank-it-beratung.de\\\/blog\\\/wp-content\\\/uploads\\\/2009\\\/09\\\/simon200x200.jpg\"},\"url\":\"https:\\\/\\\/frank-it-projekte.de\\\/blog\\\/author\\\/sfrank\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick - Socialweb Dev-Blog \/\/ Frank-IT-Beratung","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/","og_locale":"de_DE","og_type":"article","og_title":"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick - Socialweb Dev-Blog \/\/ Frank-IT-Beratung","og_description":"F\u00fcr kleine Blogprojekte setzte ich sehr gerne das nett gemachte WordPress Theme \u201eMistyLook\u201c von Sadish ein. Leider hat dies einen kleine Bug: Verwendet man Bilder-Galerien, so wird der Schatten-Effekt durch ein Link-Border \u00fcberdeckt, was ziemlich h\u00e4sslich aussieht. M\u00f6chte man dies … Weiterlesen →","og_url":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/","og_site_name":"Socialweb Dev-Blog \/\/ Frank-IT-Beratung","article_published_time":"2010-02-28T12:42:49+00:00","article_modified_time":"2013-07-09T07:02:46+00:00","author":"Simon A. Frank","twitter_card":"summary_large_image","twitter_misc":{"Verfasst von":"Simon A. Frank","Gesch\u00e4tzte Lesezeit":"2\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/#article","isPartOf":{"@id":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/"},"author":{"name":"Simon A. Frank","@id":"https:\/\/frank-it-projekte.de\/blog\/#\/schema\/person\/e31d0c55b9277739ef6c87d5e7bb47a2"},"headline":"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick","datePublished":"2010-02-28T12:42:49+00:00","dateModified":"2013-07-09T07:02:46+00:00","mainEntityOfPage":{"@id":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/"},"wordCount":319,"commentCount":1,"publisher":{"@id":"https:\/\/frank-it-projekte.de\/blog\/#\/schema\/person\/e31d0c55b9277739ef6c87d5e7bb47a2"},"keywords":["CSS","MistyLook","WordPress"],"articleSection":["CSS","Programmierung","WordPress"],"inLanguage":"de","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/","url":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/","name":"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick - Socialweb Dev-Blog \/\/ Frank-IT-Beratung","isPartOf":{"@id":"https:\/\/frank-it-projekte.de\/blog\/#website"},"datePublished":"2010-02-28T12:42:49+00:00","dateModified":"2013-07-09T07:02:46+00:00","breadcrumb":{"@id":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/frank-it-projekte.de\/blog\/2010\/02\/28\/bugfix-fur-wordpress-theme-mistylook-durch-css-trick\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Startseite","item":"https:\/\/frank-it-projekte.de\/blog\/"},{"@type":"ListItem","position":2,"name":"Bugfix f\u00fcr WordPress Theme MistyLook durch CSS-Trick"}]},{"@type":"WebSite","@id":"https:\/\/frank-it-projekte.de\/blog\/#website","url":"https:\/\/frank-it-projekte.de\/blog\/","name":"Socialweb Dev-Blog \/\/ Frank-IT-Beratung","description":"Social-Media und Web-Entwicklung: Tutorials und Tipps von Simon A. Frank","publisher":{"@id":"https:\/\/frank-it-projekte.de\/blog\/#\/schema\/person\/e31d0c55b9277739ef6c87d5e7bb47a2"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/frank-it-projekte.de\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":["Person","Organization"],"@id":"https:\/\/frank-it-projekte.de\/blog\/#\/schema\/person\/e31d0c55b9277739ef6c87d5e7bb47a2","name":"Simon A. Frank","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/frank-it-beratung.de\/blog\/wp-content\/uploads\/2009\/09\/simon200x200.jpg","url":"https:\/\/frank-it-beratung.de\/blog\/wp-content\/uploads\/2009\/09\/simon200x200.jpg","contentUrl":"https:\/\/frank-it-beratung.de\/blog\/wp-content\/uploads\/2009\/09\/simon200x200.jpg","width":200,"height":200,"caption":"Simon A. Frank"},"logo":{"@id":"https:\/\/frank-it-beratung.de\/blog\/wp-content\/uploads\/2009\/09\/simon200x200.jpg"},"url":"https:\/\/frank-it-projekte.de\/blog\/author\/sfrank\/"}]}},"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p2dxcw-3U","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/posts\/242","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/comments?post=242"}],"version-history":[{"count":1,"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/posts\/242\/revisions"}],"predecessor-version":[{"id":1078,"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/posts\/242\/revisions\/1078"}],"wp:attachment":[{"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/media?parent=242"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/categories?post=242"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/frank-it-projekte.de\/blog\/wp-json\/wp\/v2\/tags?post=242"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}