superaggy: Lücke zwischen zwei Bildern füllen.

Beitrag lesen

Das einzige was ich anbieten kann wäre der erzeugte HTML-Code im Browser.

Und genau DEN brauchen wir ja auch.

HTML:
Soo.
-Der "ja-headerwrap" ist das rechte Bild.
-Die "ja-headermask" ist der mittlere Teil, der bis zum linken wiederholt werden soll.
-Das "h1 class="logo"" ist das linke Bild

<!-- BEGIN: HEADER -->  
<div id="ja-headerwrap">  
	<div id="ja-header" class="clearfix" style="background: url(http://172.19.0.102/fuf-joomla/templates/FuF/images/header/logo1.gif) no-repeat top right;">  
  
	<div class="ja-headermask">&nbsp;</div>  
  
			<h1 class="logo">  
			<a href="/fuf-joomla/index.php" title="Fit und Fair Leipzig"><span>Fit und Fair Leipzig</span></a>  
		</h1>  
	  
			<ul class="ja-usertools-font">  
	      <li><img style="cursor: pointer;" title="Increase font size" src="http://172.19.0.102/fuf-joomla/templates/FuF/images/user-increase.png" alt="Increase font size" id="ja-tool-increase" onclick="switchFontSize('FuF_ja_font','inc'); return false;" /></li>  
		  <li><img style="cursor: pointer;" title="Default font size" src="http://172.19.0.102/fuf-joomla/templates/FuF/images/user-reset.png" alt="Default font size" id="ja-tool-reset" onclick="switchFontSize('FuF_ja_font',4); return false;" /></li>  
		  <li><img style="cursor: pointer;" title="Decrease font size" src="http://172.19.0.102/fuf-joomla/templates/FuF/images/user-decrease.png" alt="Decrease font size" id="ja-tool-decrease" onclick="switchFontSize('FuF_ja_font','dec'); return false;" /></li>  
		</ul>  
		<script type="text/javascript">var CurrentFontSize=parseInt('4');</script>  
		  
	  
	</div>  
</div>  
<!-- END: HEADER -->  

Und hier das css:

Derzeit hab ich der headermask eine fixe Breite von 550 Pixeln gegeben.

  
/* HEADER  
--------------------------------------------------------- */  
#ja-headerwrap {  
        background: #FFFFFF;  
        color: #CCCCCC;  
        line-height: normal;  
        height: 142px; /* AK: Um Menuleiste auf Balken zu setzen: 142 px */  
}  
  
#ja-header {  
        position: relative;  
        height: 188px;  
}  
  
.ja-headermask {  
        display: block;  
        background: url(../images/luecke.gif) repeat-x top right;  
        height: 188px;  
        position: absolute;  
        top: 0;  
        width: 550px;  
        right: 363px;  
}  
  
#ja-header a {  
        color: #CCCCCC;  
}  
  
h1.logo, h1.logo-text {  
        margin: 0 0 0 5px;  
        padding: 0;  
        font-size: 180%;  
        text-transform: uppercase;  
}  
  
h1.logo a {  
        width: 360px;  
        display: block;  
        background: url(../images/logo.gif) no-repeat;  
        height: 188px;  
        position: relative;  
}  
  
h1.logo a span {  
        position: absolute;  
        top: -1000px;  
}  

*immer freundlich lächeln*

:-)