Ungewollter Abstand zwischen Bildern im Header

Tobiaaatch

Gute Abend,
ich bastel gerade an einer Wordpress-Seite und habe folgendes Problem:

ich will im header gif-menüpunkte aneinander reihen.
doch zwischen den gif-bildern befindet sich ein ungewollter abstand
und ich finde keine einstellung, die diesen abstand reguliert.

habe ein screenshot gemacht und die menüpunkte markiert,
der ungewollt abstand (...rahmen?) wird sogar mit markiert!

screenshot:
http://s11.directupload.net/images/090105/fh95oi5x.jpg

danke im voraus falls einer bescheid weiß,
gruß
tobi

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

jottlieb

Nur ein Screenshot bringt nix. Man muss den Code (insbesondere auch CSS) sehen.

Tobiaaatch

mein header:

PHP

<!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" <?php language_attributes(); ?>>


<head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->


    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
    <link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    <?php wp_get_archives('type=monthly&format=link'); ?>


    <title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> &raquo; Blog Archive <?php } ?> <?php wp_title(); ?></title>


    <?php wp_head(); ?>
    
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}


function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}


function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<style type="text/css">
<!--
body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}
-->
</style></head>
<body leftmargin="0" topmargin="00" marginwidth="0" marginheight="0" onload="MM_preloadImages('http://www.ruhrpottking.de/assazeen_page/bilder/menue_02b.gif','http://www.ruhrpottking.de/assazeen_page/bilder/menue_03b.gif','http://www.ruhrpottking.de/assazeen_page/bilder/menue_04b.gif','http://www.ruhrpottking.de/assazeen_page/bilder/menue_05b.gif','http://www.ruhrpottking.de/assazeen_page/bilder/menue_06b.gif','http://www.ruhrpottking.de/assazeen_page/bilder/menue_07b.gif','http://www.ruhrpottking.de/assazeen_page/bilder/menue_08b.gif')">
<div id="base">
<div id="base2">
<div id="header">


        
    <a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/spacer.gif" alt="Home" class="home"/></a>
<ul>
            <p>
              <?php if (is_page()) { $highlight = "page_item"; } else {$highlight = "page_item current_page_item"; } ?>
              
              
    </p>
            <table border="0" align="center" cellpadding="0" cellspacing="0">
              <tr>
                <td height="250" colspan="9">&nbsp;</td>
              </tr>
              <tr>
                <td width="20" align="center" nowrap="nowrap"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_01.gif" width="20" height="39" hspace="0" vspace="0" border="0"/></td>
                <td width="61" align="center" nowrap="nowrap"><a href="newsccc" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bild11','','http://www.ruhrpottking.de/assazeen_page/bilder/menue_02b.gif',1)"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_02.gif" name="Bild11" border="0" id="Bild11" /></a></td>
                <td width="32" align="center"><a href="artistcccc" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bild10','','http://www.ruhrpottking.de/assazeen_page/bilder/menue_03b.gif',1)"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_03.gif" name="Bild10" border="0" id="Bild10" /></a></td>
                <td width="32" align="center" nowrap="nowrap"><a href="releasesccc" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bild12','','http://www.ruhrpottking.de/assazeen_page/bilder/menue_04b.gif',1)"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_04.gif" name="Bild12" border="0" id="Bild12" /></a></td>
                <td width="32" align="center" nowrap="nowrap"><a href="mediaccc" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bild13','','http://www.ruhrpottking.de/assazeen_page/bilder/menue_05b.gif',1)"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_05.gif" name="Bild13" border="0" id="Bild13" /></a></td>
                <td width="32" align="center" nowrap="nowrap"><a href="forumccc" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bild14','','http://www.ruhrpottking.de/assazeen_page/bilder/menue_06b.gif',1)"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_06.gif" name="Bild14" border="0" id="Bild14" /></a></td>
                <td width="32" align="center" nowrap="nowrap"><a href="forumccc" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bild15','','http://www.ruhrpottking.de/assazeen_page/bilder/menue_07b.gif',1)"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_07.gif" name="Bild15" border="0" id="Bild15" /></a></td>
                <td width="32" align="center" nowrap="nowrap"><a href="shop" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bild16','','http://www.ruhrpottking.de/assazeen_page/bilder/menue_08b.gif',1)"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_08.gif" name="Bild16" border="0" id="Bild16" /></a></td>
                <td width="361" align="center" nowrap="nowrap"><img src="http://www.ruhrpottking.de/assazeen_page/bilder/menue_09.gif" alt="" width="361" height="39" border="0" /></td>
              </tr>
    </table>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
</ul>


</div>
    <div id="container">

Alles anzeigen

Tobiaaatch

meine style.css

Code

/*




/* ---------------------------------------------------------------------------------- */


/***** general *****/
body {
    margin:0px auto;
    font-size: 12px;
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
    background: url('images/bg.jpg') no-repeat top;
    background-color:#2f6090;
    background-attachment: fixed;


}
img {
    border:0px;
    padding:5px;
    max-width: 100%; /* not working in IE6*/
}
a {color:#003399;text-decoration: none;}
a:hover {color: #000000;text-decoration: none;}


h1 {font-size:30px;}
h2 {font-size:26px;}
h3 {font-size:21px;}
h4 {font-size:17px;}
h5 {font-size:14px;}
h6 {font-size:12px;}


p {margin: 0px 0px 12px 0px;}
hr {height:1px;border:none;border-top:1px dashed #2f5f90; width:90%;}


blockquote {
    clear: left;
    text-align: justify;
    padding: 0px 0px 0px 10px;
    margin: 20px 20px 10px 20px;
    border-left: 2px solid #2f5f90;
}
input {
    margin-bottom:5px;
    vertical-align: middle;
}
select{
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
}
code{
    font: 1.1em 'Courier New', Courier, Fixed;
}


.alignleft {float: left;}
.alignright {float: right;}
.aligncenter,div.aligncenter{
    display: block;
   margin-left: auto;
   margin-right: auto;
}
img.alignleft {
    padding: 5px;
    margin: 0 7px 2px 0;
    display: inline;
}


img.alignright {
    padding: 5px;
    margin: 0 0 2px 7px;
    display: inline;
}
img.centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.clear {clear:both;}
.spacer {height:29px;}
/***** layout *****/
#base{
    width:888px;
    margin:0px auto;
    background: url(images/repeater.jpg) repeat-y center;
}
#base2{
    width:888px;
    background: url(images/footer.jpg) no-repeat center bottom;
}
#header{
    position:relative;
    width: 888px;
    height: 334px;
    background:url(images/header.jpg) no-repeat center;
}
#container{
    position:relative;
    width:888px;
    overflow:hidden;
    background:url(images/container_bg.jpg) no-repeat 0 0;
    background-color:#ffffff;


    


}


#content{ /*width=698px*/
    float:left;
    display:inline; 
    overflow:hidden; /*when ie6, image's with is > content width, hidden*/
    width:525px;
    min-height:614px; /*ie6 not support*/
    padding: 0px 15px 0px 25px;
    background:url('') no-repeat 567px 0px;
}
#sidebar{ /*width=190px*/
    float:right;
    display:inline; 
    overflow:hidden;
    width: 300px;
    margin:0 0 0 0;
    padding: 0px 8px 0px 8px;
    color:#ffffff;
}
#footer {
    clear:both;
    margin:0px;
    color: #ffffff;
    font-size: 11px;
    padding:35px 190px 14px 20px;
}
#footer a {color: #ffffff; font-weight:bold;}


/***** header *****/


#header ul {
    position: absolute;
    height: 22px;
    float:right;
    top: 27px;
    right: 50px;
    margin:0px;
}
#header ul li {
    display: inline;
    font-size: 13px;
}


#header ul li a {
    display: block;
    float: left;
    line-height: 22px;
    color: #ffffff;
    padding: 0 15px;
    text-decoration:none;
}


#header ul li a:hover, #header ul li.current_page_item a {
    background: #6c9025;
}


#header img.home {
    
    position: absolute;
    margin:0px;padding:0px;
    right: 15px;
    top: 19px;
    width:35px;
    height:35px;
}


/***** content *****/


.archivetitle {
    color: #000000;
    font-size: 14px;
    font-variant: normal;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 12px 0px;
}
.title, .title a {
    color: #000000;
    font-size: 20px;
}


.date {
    font-size: 10px;
    padding: 0px 0px 4px 0px;
    border-bottom: 1px solid #2f5f90;
}


.entry {
    color: #000000;
    line-height: 1.6em;
    text-align: justify;
    padding: 8px 0px 0px 0px;
}
.page_entry {
    margin: 10px 0px 0px 0px;
    padding: 2px 0px 20px 0px;
    border-top: 2px solid #2f5f90;
    border-bottom: 1px solid #2f5f90;
}


.info {
    line-height: 1.6em;
    font-size: 10px;
    text-align: left;
    margin: 0px 1px 50px 0px;
    padding: 4px 0px 1px 1px;
    border-top: 1px solid #2f5f90;
}
.category {
    font-size: 10px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 4Px 20px;
    background: url('images/category.gif') no-repeat top left transparent;
}


.tags {
    font-size: 10px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 4px 20px;
    background: url('images/tags.gif') no-repeat top left transparent;
}


.bubble {
    font-size: 10px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 4px 20px;
    background: url('images/bubble.gif') no-repeat top left transparent;
}




.navigation {
    font-size: 11px;
    margin: 40px 0px 0px 0px;
    padding: 2px 0px 17px 0px;
    border-top: 2px solid #2f5f90;
    border-bottom: 1px solid #2f5f90;
}


.sorry {
    font-size: 11px;
    font-style: italic;
    margin: 8px 0px 0px 0px;
    padding: 3px 0px 3px 0px;
    border-top: 1px solid #2f5f90;
    border-bottom: 1px solid #2f5f90;
}
#postmetadata {
    font-size: 12px;
    margin: 10px 0px 20px 0px;
    padding: 5px 15px 5px 15px;
    border-top: 1px solid #2f5f90;
    border-bottom: 2px solid #2f5f90;
}


.nocomments {background: none; color: #000000;}
.commenttitle {
    color: #000000;
    font-size: 14px;
    text-align: left;
    font-weight: bold;
    margin: 0px 0 20px 0;
    padding: 2px 0px 2px 0px;
    font-variant: normal;
    border-bottom: 1px solid #95abc0;
}
.commentlist {list-style: none;}
.commentbody {
    color: #000000;
    font-size: 11px;
    position: relative;
    list-style-type: none;
    margin: 0px 0px 15px 0px;
    padding: 0px 0px 0px 0px;
    border-bottom: 1px solid #95abc0;
}


.adminbody {
    color: #000000;
    font-size: 11px;
    position: relative;
    list-style-type: none;
    margin: 0px 0px 20px 25px;
    padding: 0px 0px 0px 0px;
    border-bottom: 1px solid #95abc0;
}
.commenthead {
    color: #000000;
    padding: 5px 0px 8px 0px;
    margin: 0px 0px 10px 0px;
    border-bottom: 1px dotted #95abc0;
    background:#ffffff;
}




.adminhead {
    color: #000000;
    margin: 0px 0px 10px 0px;
    padding: 5px 0px 8px 0px;
    border-bottom: 1px dotted #95abc0;
    background:#ffffff;
}


.avatar {
    position:relative;
    float: left;
    margin: 0px 5px 0px 0px;
    padding: 0px;
    background: #ffffff;
}
.commentcount {
    float: right;
    color: #000000;
    font-size: 20px;
    font-weight: bold;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    font-family: Georgia, Times, 'Times New Roman', serif;
}
.authorlink {color: #000000; font-size: 11px; font-weight: bold;}
.authorlink a {color: #000000; font-size: 11px; font-weight: bold;}
.commentlink {font-size: 10px; color: #000000;}
.trackhead {
    color: #000000;
    margin: 0px 0px 10px 0px;
    padding: 7px 0px 8px 41px;
    border-bottom: 1px dotted #95abc0;
    background: url(images/track.jpg) no-repeat top left;
}
.trackbody {
    color: #000000;
    font-size: 11px;
    position: relative;
    list-style-type: none;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 20px 0px;
    border-bottom: 1px solid #95abc0;
}
.trackbody p a {color: #000000;}
#commentform {
    margin:0;
    padding:20px 0 0 0;
}
#email, #author, #url {
    color: #000000;
    font-size: 12px;
    background: none;
    padding-left: 2px;
    vertical-align: middle;
    border: 1px solid #2f5f90;
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
}
#comment {
    width: 400px;
    color: #000000;
    font-size: 12px;
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
    border: 1px solid #95abc0;
    padding: 2px 2px 2px 2px;
}
#submit {
    width: 80px;
    height: 20px;
    color: #000000;
    font-size: 12px;
    background: #ffffff;
    margin: 0px 0px 0px 0px;
    padding: 0px 10px 2px 10px;
    border: 1px solid #95abc0;
    font-family: Verdana, Arial, Helvetica, Sans-Serif;
}


/***** search *****/
#searchform{
    margin:0 0 15px 0;
    padding:0 0 0 0;
}
.searchbox {
    position:relative;
    margin:0 0 0 0;
    padding:0 0 0 0;
    width:170px;
    height:28px;
}    
.search-field input {
    position:relative;
    float:left;
    top:8px;
    left:8px;
    width:117px; 
    height:13px; 
    font-family:Verdana;
    font-size:11px; 
    font-weight:bold;
    color:#999999; 
    padding:2px 3px 1px 3px;
    border:0px;
    background:#f0f0f0;
}
.search-but input {
    float:right;
    position:relative;
    top:5px;
    right:10px;
    width:25px; 
    height:22px;
}
/***** sidebar *****/
#sidebar a{color:#ffffff;}
#sidebar a:hover {color:#2f5f90;}
#sidebar ul {
    list-style-type: none;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
#sidebar li {
    list-style-type: none;
    margin: 0px 0px 24px 0px;
    padding: 2px 0px 2px 0px;
    border-bottom: 1px dotted #2f5f90;
}




#sidebar ul ul li {
    color: #c8c8c8;
    line-height: 1.6em;
    list-style-type: none;
    font-size:12px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 2px 13px;
    border:0px;
    background:url('images/titlearrow.gif') no-repeat 0px 5px;
}
#sidebar ul ul ul li {
    font-size:12px;
    border:0px; 
    margin: 0px 0px 0px 1px; 
    padding: 0px 0px 0px 12px;
    line-height: 1.5em; 
    background:url('images/arrow.gif') no-repeat 0px 5px;
    color: #ffffff;
}


#sidebar h1 {
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 0px;
    font-variant: normal;
    margin: 0px 0px 0px 0px;
    padding: 3px 20px 3px 0px;
    border-top: 3px solid #2f5f90;
    border-bottom: 1px solid #2f5f90;
   background:url('images/sidetitle.gif') no-repeat right;
}
#sidebar select{
    margin:5px 0px 2px 2px;
    font-size:11px;
    width:170px;
    overflow:hidden;
}

Alles anzeigen

passte nicht alles in einen post*

maxe

Dann nimm bei img mal den Abstand raus:

Code

img {
    border:0px;
    [COLOR=Red]padding:5px;[/COLOR]
    max-width: 100%; /* not working in IE6*/
}

oder noch besser setzt für die img nur im #header den Abstand auf 0:

Code

#header img {
padding:0;
}

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Ungewollter Abstand zwischen Bildern im Header

Jetzt mitmachen!