Hi,
ich versuche mich derzeit darin, ein eigenes WP-Template auf die Beine zu stellen, noch bin ich ganz am Anfang (nach wordpress.lernenhoch2.de).
Und schon stellt sich ein, mit Sicherheit ganz einfaches, Problem ein, dass ich nicht gelöst bekomme. Ich möchte nämlich, ganz einfach, den Wrapper, also den alles umfassenden Container zentrieren, aber es will nicht klappen.
Die Website sieht derzeit so aus (XAMPP auf dem Heimrechner):
http://www.abload.de/img/untitled-1copyvvl0r.jpg
style.css
body {background: #FF0000; border: 10px solid;}
#wrapper {width: 660px; background: #228B22; border: 5px solid; text-align: center; align: center;}
#header {width: 640px; height: 400px; border: 1px solid;}
#main {width: 400px;}
#sidebar {float: left;}
#footer {height: 100px;}
#navmenu ul {list-style-type: none; list-style-image: none; }
#navmenu li {display: inline; }
#navmenu ul li a {text-decoration:none; margin: 4px; padding: 5px 20px 5px 20px; color: blue; background: pink;}Wie man sehen kann, werden Rahmen (border) als auch Hintergrundfarbe (background) des wrappers nicht wiedergegeben, ganz zu schweigen von der Zentrierung...
index.php
<?php get_header(); ?>
<div id="main">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2>
<div id="meta">
erstellt am: <?php the_date('d.m.Y'); ?> |
Kategorie(n): <?php the_category(', '); ?></p>
</div>
<div class="entry">
<?php the_content(); ?>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div>
<div id="sidebar"><?php get_sidebar(); ?></div>
<?php get_footer(); ?>header.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//DE" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('utf-8'); ?>" />
<title><?php wp_title(); ?> - <?php bloginfo('name'); ?></title>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen"/>
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head(); ?>
</head>
<body>
<div id="wrapper">
<div id="header">
<h1><a href="<?php bloginfo('url'); ?>"><img src="/wordpress/wp-content/themes/test-two/images/logo.jpg"></a></h1>
<div id="navmenu">
<ul>
<li><a href="<?php echo get_settings('home'); ?>">HOME</a></li>
<li><a href="wordpress/recipes/"><img src="/wordpress/wp-content/themes/test-two/images/nav-work.jpg"></a></li>
<li><a href="wordpress/travel/">TRAVEL</a></li>
<li><a href="http://www.wordpress.org">WORDPRESS</a></li>
<li><form method="get" id="searchform" action="<?php echo $_SERVER['PHP_SELF']; ?>"><input type="text" value="<?php echo wp_specialchars($s, 1); ?>" name="s" id="s" /><input type="submit" id="search_submit" value="Suchen" /></form></li></ul></div>
</div>footer.php
<div id="footer"></div>
</div>
</body>
</html>Weitere Probleme sind: wieso wird das Suchfeld nich inline wiedergegeben? Und wie ließe sich via CSS ein hover-Effekt bzgl. der Navi-Grafiken machen?
ANY HELP?