✔ Layout Probleme

RoyalArsenal

RoyalArsenal

Mitglied
Hi Leute,

Habe unter http://silverscreen87.blogspot.com/ ein Blog modifiziert, doch gibt es noch einige Dinge bei denen ich Hilfe gebrauchen könnte:

1. Wenn man runter scrollt endet das Sidebar-Background mitten im Text. Wie kann ich es so verändern, dass der Sidebar-Backgroundimmer bis zum Footer geht?

2. Ich hab ein Logo erstellt, dass ich jetzt gerne im Header platzieren würde. Wo muss ich das Logo im HTML wie platzieren, damit er im Header erscheint? Direkt auf die Headerbilder wäre zu umständlich, da ich Random Headers benutze.

3. Am linken Rand des Blogs ist ein schwarzer Schatten zu sehen. Der hört nach dem Header auf der rechten Seite jedoch auf. Wie kann ich den bis nach ganz unten verlängern?

Der HTML Code sieht wie folgt aus:

PHP: 
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//ES" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  <head>
    <b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>
    <b:skin><![CDATA[/*

/* **************************
Plantilla adaptada a Blogger por blogandweb
Diseño original por David Herreman.

Encuentra esta y más plantillas en:
http://www.blogandweb.com

Recuerda que esta plantilla es gratuita y esta 
bajo una licencia Creative Commons Atribution.
Puedes usarla para fines personales o comerciales 
pero NO REMOVER LOS CREDITOS

Una bonita forma de agradecer es dando un link a blogandweb.
***************************** */


/* Definición de variables
   ====================
    <Variable name="bgcolor" description="Color de fondo del blog"
             type="color" default="#303B41" value="#303B41">
   <Variable name="textocolor" description="Color general del texto"
             type="color" default="#808080" value="#333333">
   <Variable name="enlacecolor" description="Color de los enlaces (links)"
             type="color" default="#075181" value="#075181">
   <Variable name="colortituloblog" description="Color del título del blog"
             type="color" default="#FFFFFF" value="#ffffb3">
   <Variable name="descripcioncolor" description="Color de la descripción del blog"
             type="color" default="#075181" value="#d9e6ff">
   <Variable name="colortituloentrada" description="Color del títulos lateral"
             type="color" default="#075181" value="#075181">
   <Variable name="colortitentrada" description="Color título entrada"
             type="color" default="#085281" value="#2D8930">
   <Variable name="colortextolateral" description="Color de los links en la barra lateral"
             type="color" default="#546078" value="#546078">
*/

#outer-wrapper {
	background: #FFF url(http://img291.imageshack.us/img291/2285/blogyazulmainbgyc0.jpg) repeat-y center;
	color: #ccc; 
	margin: 0 auto; 
	padding: 0; 
	width: 800px
}

#navbar-iframe {
   height:0px;
   visibility:hidden;
   display:none
}

/*-- (Genrales) --*/

body { 
	margin:0px 0; 
	padding:0; 
	color: $textocolor;  
	background: $bgcolor url(http://img291.imageshack.us/img291/4232/blogyazulbgcw8.jpg) repeat-x;
	line-height: 1.4em; font-style:normal; font-variant:normal; font-weight:normal; font-size:74%; font-family:Arial, Sans-Serif 
}

a img
{
padding:2px;
background:#FFF;
border:1px solid #333;
}

ul { margin-left: 0; padding-left: 5px; list-style : square; }
li { 	margin: 0 0 2px 15px; padding: 0 0 0 0px;	color: #555; }
.sub  {margin: 0 0 2px 30px; padding: 0 0 0 0px;  color: #888; }

p { margin: 0 0 5px 0; padding: 0; color: $textocolor; background: inherit; }
a { color: $enlacecolor; background: inherit; text-decoration:none; }
a:hover { background: inherit; text-decoration:underline; }

h1 { 
	padding:0; 
	margin:0; 
	color: $colortituloblog; 
	background: inherit;
	font: bold 1.8em Arial, Sans-Serif; 
	letter-spacing: -1px;
        position: absolute;
        top: -1000px;
        left: -1000px;
}

h1 a { color: $colortituloblog; background: inherit; }

h2 { 
	background: url(http://bp2.blogger.com/_Zuzii37VUO4/RlYg0Jya0EI/AAAAAAAABg4/f5OcBDnLxq8/s1600/h.gif) no-repeat left;
	color:$colortituloentrada;
	font-size:140%; 
	font-weight:bold; 
	margin-left:0px; margin-right:0; margin-top:5px; margin-bottom:5px; padding-left:30px; padding-right:0; padding-top:0; padding-bottom:0 
}

h2 a { background: #F2EEEB; color: #075181; }
h2 a:hover { background: #FFF; color: #68ADD5; text-decoration:none;  }

fieldset {	border: 1px solid #075181; }

#main-wrapper {overflow:hidden;} 
.clear {clear:both;}
#blog-pager-newer-link {float: left;} 
#blog-pager-older-link {float: right;} 
#blog-pager {text-align: center; }

/*-- (Cabecera) --*/

#top {
	padding: 0;
        width: 985px;
	margin: 0;
	background: #000 url(http://lh6.ggpht.com/_7C4NVJJsAWU/SZCAb31C96I/AAAAAAAABOY/QLyjXT9en90/topfinal.jpg) no-repeat top;
	height: 44px
}

#top .padding { 
	float: right;
	color: #808080;
	padding: 20px 25px 0 0;
	font-size: 90%;
}

#top a { color: #E0F5FF; }

#header-wrapper {
	margin: 0; 
	width: 985px; 
	 background: #036EB4 url(http://lh4.ggpht.com/_7C4NVJJsAWU/SZCnhPbfiUI/AAAAAAAABQU/CJcPvAJSvew/headerbackground.jpg) no-repeat center top; 
	height: 250px; 
	color: #FFF 
}

#header-wrapper h1 {
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 22px; font-weight: bold;
		margin: 0;
		padding: 0; 
}

#header-inner {
	padding: 250px 0 0 50px; 
}

#header-wrapper p {
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 12px; 
		background-image: url('none');
		color: $descripcioncolor;
		margin: 0;
		padding-left:2px; padding-right:0; padding-top:0; padding-bottom:0
}

#header-wrapper a {

}

#content-wrapper {
background: #F2EEEB; width: 950px; margin: 0 20px 0 20px; color: #808080;
}

/*-- (Menú) --*/

#subheader { 
	background: #000 repeat-y center;
	width: 955px;
	height: 35px;
	color: #FFF;
	margin-left: 15px;
	
}
#subheader .padding { padding: 10px 15px 10px 15px; }
#subheader h2 { color: #FEAB06; }
#subheader a {color: #FECF5F; }

#menu {
	background: #000 url(menu.jpg) no-repeat center bottom;
	width: 880px;
	height: 35px;
	margin: 0;
	padding: 0
}

#menu ul { margin:0; list-style:none; padding: 5px 0 0 20px; }
#menu a, #nav strong, #nav span { float:left; display:block; color:#fff; padding: 5px; text-decoration:none;  }
#menu a { float:none; }
#menu li { float:left; color: #FFF; background: #000; margin:0; padding:0 0 0 0px; }
#menu a:hover { text-decoration:underline;}  
#menu .padding { padding: 5px 0 0 10px; font-weight: bold; }

/*-- (Principal) --*/

#main-wrapper {
float: left; width: 680px; background: #F2EEEB; padding:15px 15px 0 20px; margin:0;
}

#main-wrapper ul {
	margin: 5px 0 5px 0; 
	padding : 0; 
	list-style : none; 
	border-bottom: 0px solid #eee; 
	list-style-type: square;
	color: #a90000;
}

#main-wrapper li{
	margin: 0 0 2px 15px;
	padding: 0 0 0 0px;
	color: #555;
}

#main-wrapper a:hover {
}

.post {
margin:0 0 25px 0;
}
.post-title, .post-title a {
color:$colortitentrada;
}

.post-body {
}

.date-header {
 font: 85% Arial, Sans-Serif; margin: 0 0 10px 0px; padding: 0; color: #5f5f5f; background: inherit; border-bottom: 1px solid #2D8930;
}

.post-footer {
padding:2px 3px 3px 8px;
border:1px solid #e3e4e4;
background-color:#f5f5f5;
font-size:0.9em;
color:#505050;
}

/*-- (Lateral) --*/

#sidebar-wrapper {
        float: right;
	padding:0px 0 0 0; margin:0;
	background-image: url(http://lh5.ggpht.com/_7C4NVJJsAWU/SZFaCIbTWzI/AAAAAAAABQ8/GJx-JjrSd0c/sidebarbackground.jpg);
	width: 210px; 
}

#sidebar { text-align: left; 
        color: #7D8085; 
        font-size:0.97em;
        padding: 20px 0 0 0px; 
        width: 200px; 
}
#sidebar li { 
	margin: 5px 0 5px 0px; 
	padding: 0px 0 0 0px; 
	border-bottom: 1px dotted #ccc; 
	list-style: none;
}
#sidebar li a { 
 color: $colortextolateral;
 text-decoration: none;
 padding: 5px 0 0 0px;
 margin-bottom: 5px;
}

#sidebar li a:hover { 
 color: #075181;
 text-decoration: none;
 background: #E5F6FF;
 margin-bottom: 5px;
}

.sidebar .widget {
 margin-bottom: 20px;
}

/*-- (Pie de página) --*/

#footer-wrapper {
	clear:both;
        width: 985px;
	height: 43px;
	color:#ccc;  
	background: #000 url(http://lh3.ggpht.com/_7C4NVJJsAWU/SZCEYIjem4I/AAAAAAAABO4/4-OSTzunmiU/footerfinal.jpg) no-repeat top; 
	font-size:90%; 
	padding: 0; 
	text-align:center 
}

#footer-wrapper a { color: #E0F5FF; }

#footer-wrapper .links {
padding: 10px 0px 0px 0px; 
}

/*-- (ICONOS) --*/

.date-header {
padding-left: 15px;
background: url(http://bp0.blogger.com/_Zuzii37VUO4/RlXuS5yaz8I/AAAAAAAABf8/lPnKpN8Vd4k/s1600/timeicon.gif) center left no-repeat;
}

.post-author {
padding-left: 15px;
background: url(http://bp3.blogger.com/_Zuzii37VUO4/RlXuBpyaz1I/AAAAAAAABfE/DFaeuXvDlR4/s1600/author.gif) center left no-repeat;
}

.comment-link {
padding-left: 15px;
background: url(http://bp3.blogger.com/_Zuzii37VUO4/RlXuSpyaz5I/AAAAAAAABfk/AbUwoyxiNoI/s1600/comments.gif) center left no-repeat;
}

.blog-feeds {
padding-left: 20px;
padding-top: 5px;
background: url(http://bp0.blogger.com/_Zuzii37VUO4/Rj7ME-MBRJI/AAAAAAAAAwM/IOo-YUYR5aM/s1600/icono-feed.gif) center left no-repeat;
}

]]></b:skin>
<link href='http://plantillasblogyweb.googlepages.com/estilos-blogger.css' rel='stylesheet' type='text/css'/>
<link href='http://plantillasblogyweb.googlepages.com/blogy-azul.css' rel='stylesheet' type='text/css'/>  </head>

  <body>
  <script type='text/javascript'>

var banner= new Array()

banner[0]=&quot;http://lh6.ggpht.com/_7C4NVJJsAWU/SZCPvilXBwI/AAAAAAAABPA/e0QfDJtLifg/header1.jpg&quot;
banner[1]=&quot;http://lh4.ggpht.com/_7C4NVJJsAWU/SZCRJiG9AAI/AAAAAAAABPI/6vSL0tdOYLM/header2.jpg&quot;
banner[2]=&quot;http://lh3.ggpht.com/_7C4NVJJsAWU/SZCRJ46PssI/AAAAAAAABPQ/a8r58jVAOJM/header3.jpg&quot;
banner[3]=&quot;http://lh3.ggpht.com/_7C4NVJJsAWU/SZClf2ff-tI/AAAAAAAABPc/jvGF5uXxyus/header4.jpg&quot;
banner[4]=&quot;http://lh3.ggpht.com/_7C4NVJJsAWU/SZClpk4At6I/AAAAAAAABPk/Aa5KHAWywQk/header5.jpg&quot;
banner[5]=&quot;http://lh6.ggpht.com/_7C4NVJJsAWU/SZClpqr_WGI/AAAAAAAABPs/RMNrSrFCBts/header6.jpg&quot;
banner[6]=&quot;http://lh5.ggpht.com/_7C4NVJJsAWU/SZClpsjuilI/AAAAAAAABP0/wvxPOSBe270/header7.jpg&quot;
banner[7]=&quot;http://lh5.ggpht.com/_7C4NVJJsAWU/SZCl1o0OENI/AAAAAAAABP8/pEV5lUC12m8/header8.jpg&quot;
banner[8]=&quot;http://lh6.ggpht.com/_7C4NVJJsAWU/SZCl1qETK1I/AAAAAAAABQE/Lz-u9CUrrJM/header9.jpg&quot;
banner[9]=&quot;http://lh5.ggpht.com/_7C4NVJJsAWU/SZCl1445NkI/AAAAAAAABQM/Pv6_o3HcA4M/header10.jpg&quot;
var random=Math.round(9*Math.random());

document.write(&quot;<style>&quot;);
document.write(&quot;#header {&quot;);
document.write(' background:url(&quot;' + banner[random] + '&quot;) no-repeat left TOP;');
document.write(&quot; }&quot;);
document.write(&quot;</style>&quot;);

</script>
  <div id='outer-wrapper'><div id='wrap2'>

    <!-- links para navegadores de texto -->
    <span id='skiplinks' style='display:none;'>
      <a href='#main'>ir a principal </a> |
      <a href='#sidebar'>Ir a lateral</a>
    </span>

<div id='top'>
	<div class='padding'>
		<a href='http://silverscreen87.blogspot.com/feeds/posts/default'>RSS</a>
	</div>
</div>

<!-- (Cabecera) -->
    <div id='header-wrapper'>
     <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Silver Screen (Header)' type='Header'/>
</b:section>
    </div>

<div id='subheader'>
	<div id='menu'>
	  <ul>
		<li class='page_item'><a href='http://silverscreen87.blogspot.com/'>Home</a></li>
		<li class='page_item'><a href='http://silverscreen87.blogspot.com/2005/01/filmarchiv.html'>Filmarchiv</a></li>
	  </ul>
	</div>
</div>

<!-- (Contenedor) -->	
    <div id='content-wrapper'>

<!-- (Principal) -->
      <div id='main-wrapper'>
        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog-Posts' type='Blog'/>
</b:section>
      </div>

<!-- (Lateral) -->
      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='Über mich' type='Profile'/>
<b:widget id='LinkList1' locked='false' title='Blogroll' type='LinkList'/>
<b:widget id='LinkList2' locked='false' title='Links' type='LinkList'/>
<b:widget id='BlogArchive1' locked='false' title='Blog-Archiv' type='BlogArchive'/>
<b:widget id='Text3' locked='false' title='Bewertungsskala' type='Text'/>
<b:widget id='Text1' locked='false' title='Filmreviews' type='Text'/>
<b:widget id='Text2' locked='false' title='Serienreviews' type='Text'/>
<b:widget id='HTML1' locked='false' title='Besucher' type='HTML'/>
</b:section>
      </div>

<!-- Limpiar flotación-->
      <div class='clear'/>

    </div> <!-- fin de capa content-wrapper -->

<!-- (Pie de página) -->
    <div id='footer-wrapper'>
<!-- RECUERDA QUE ESTA PLANTILLA ES GRATUITA, POR FAVOR NO REMUEVAS LOS CREDITOS -->
  <p class='links'> Diseño por  
  <a href='http://www.free-css-templates.com/'>David Herreman</a> 
  | A <a href='http://www.blogger.com'>Blogger</a> por  
  <a href='http://blogandweb.com/'>Blog and Web</a></p>
    </div>

  </div></div> <!-- fin de capa outer-wrapper -->
</body>
</html>

Würde mich ungemein auf ein paar Hilfestellungen freuen! :)
 
RoyalArsenal hat gesagt.:
Der HTML Code sieht wie folgt aus:

PHP: 
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//ES" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
  <head>
    <b:include data='blog' name='all-head-content'/>
    <title><data:blog.pageTitle/></title>
    <b:skin><![CDATA[/*

/* **************************
Plantilla adaptada a Blogger por blogandweb
Diseño original por David Herreman.

Encuentra esta y más plantillas en:
http://www.blogandweb.com

Recuerda que esta plantilla es gratuita y esta 
bajo una licencia Creative Commons Atribution.
Puedes usarla para fines personales o comerciales 
pero NO REMOVER LOS CREDITOS

Una bonita forma de agradecer es dando un link a blogandweb.
***************************** */


/* Definición de variables
   ====================
    <Variable name="bgcolor" description="Color de fondo del blog"
             type="color" default="#303B41" value="#303B41">
   <Variable name="textocolor" description="Color general del texto"
             type="color" default="#808080" value="#333333">
   <Variable name="enlacecolor" description="Color de los enlaces (links)"
             type="color" default="#075181" value="#075181">
   <Variable name="colortituloblog" description="Color del título del blog"
             type="color" default="#FFFFFF" value="#ffffb3">
   <Variable name="descripcioncolor" description="Color de la descripción del blog"
             type="color" default="#075181" value="#d9e6ff">
   <Variable name="colortituloentrada" description="Color del títulos lateral"
             type="color" default="#075181" value="#075181">
   <Variable name="colortitentrada" description="Color título entrada"
             type="color" default="#085281" value="#2D8930">
   <Variable name="colortextolateral" description="Color de los links en la barra lateral"
             type="color" default="#546078" value="#546078">
*/

#outer-wrapper {
	background: #FFF url(http://img291.imageshack.us/img291/2285/blogyazulmainbgyc0.jpg) repeat-y center;
	color: #ccc; 
	margin: 0 auto; 
	padding: 0; 
	width: 800px
}

#navbar-iframe {
   height:0px;
   visibility:hidden;
   display:none
}

/*-- (Genrales) --*/

body { 
	margin:0px 0; 
	padding:0; 
	color: $textocolor;  
	background: $bgcolor url(http://img291.imageshack.us/img291/4232/blogyazulbgcw8.jpg) repeat-x;
	line-height: 1.4em; font-style:normal; font-variant:normal; font-weight:normal; font-size:74%; font-family:Arial, Sans-Serif 
}

a img
{
padding:2px;
background:#FFF;
border:1px solid #333;
}

ul { margin-left: 0; padding-left: 5px; list-style : square; }
li { 	margin: 0 0 2px 15px; padding: 0 0 0 0px;	color: #555; }
.sub  {margin: 0 0 2px 30px; padding: 0 0 0 0px;  color: #888; }

p { margin: 0 0 5px 0; padding: 0; color: $textocolor; background: inherit; }
a { color: $enlacecolor; background: inherit; text-decoration:none; }
a:hover { background: inherit; text-decoration:underline; }

h1 { 
	padding:0; 
	margin:0; 
	color: $colortituloblog; 
	background: inherit;
	font: bold 1.8em Arial, Sans-Serif; 
	letter-spacing: -1px;
        position: absolute;
        top: -1000px;
        left: -1000px;
}

h1 a { color: $colortituloblog; background: inherit; }

h2 { 
	background: url(http://bp2.blogger.com/_Zuzii37VUO4/RlYg0Jya0EI/AAAAAAAABg4/f5OcBDnLxq8/s1600/h.gif) no-repeat left;
	color:$colortituloentrada;
	font-size:140%; 
	font-weight:bold; 
	margin-left:0px; margin-right:0; margin-top:5px; margin-bottom:5px; padding-left:30px; padding-right:0; padding-top:0; padding-bottom:0 
}

h2 a { background: #F2EEEB; color: #075181; }
h2 a:hover { background: #FFF; color: #68ADD5; text-decoration:none;  }

fieldset {	border: 1px solid #075181; }

#main-wrapper {overflow:hidden;} 
.clear {clear:both;}
#blog-pager-newer-link {float: left;} 
#blog-pager-older-link {float: right;} 
#blog-pager {text-align: center; }

/*-- (Cabecera) --*/

#top {
	padding: 0;
        width: 985px;
	margin: 0;
	background: #000 url(http://lh6.ggpht.com/_7C4NVJJsAWU/SZCAb31C96I/AAAAAAAABOY/QLyjXT9en90/topfinal.jpg) no-repeat top;
	height: 44px
}

#top .padding { 
	float: right;
	color: #808080;
	padding: 20px 25px 0 0;
	font-size: 90%;
}

#top a { color: #E0F5FF; }

#header-wrapper {
	margin: 0; 
	width: 985px; 
	 background: #036EB4 url(http://lh4.ggpht.com/_7C4NVJJsAWU/SZCnhPbfiUI/AAAAAAAABQU/CJcPvAJSvew/headerbackground.jpg) no-repeat center top; 
	height: 250px; 
	color: #FFF 
}

#header-wrapper h1 {
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 22px; font-weight: bold;
		margin: 0;
		padding: 0; 
}

#header-inner {
	padding: 250px 0 0 50px; 
}

#header-wrapper p {
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 12px; 
		background-image: url('none');
		color: $descripcioncolor;
		margin: 0;
		padding-left:2px; padding-right:0; padding-top:0; padding-bottom:0
}

#header-wrapper a {

}

#content-wrapper {
background: #F2EEEB; width: 950px; margin: 0 20px 0 20px; color: #808080;
}

/*-- (Menú) --*/

#subheader { 
	background: #000 repeat-y center;
	width: 955px;
	height: 35px;
	color: #FFF;
	margin-left: 15px;
	
}
#subheader .padding { padding: 10px 15px 10px 15px; }
#subheader h2 { color: #FEAB06; }
#subheader a {color: #FECF5F; }

#menu {
	background: #000 url(menu.jpg) no-repeat center bottom;
	width: 880px;
	height: 35px;
	margin: 0;
	padding: 0
}

#menu ul { margin:0; list-style:none; padding: 5px 0 0 20px; }
#menu a, #nav strong, #nav span { float:left; display:block; color:#fff; padding: 5px; text-decoration:none;  }
#menu a { float:none; }
#menu li { float:left; color: #FFF; background: #000; margin:0; padding:0 0 0 0px; }
#menu a:hover { text-decoration:underline;}  
#menu .padding { padding: 5px 0 0 10px; font-weight: bold; }

/*-- (Principal) --*/

#main-wrapper {
float: left; width: 680px; background: #F2EEEB; padding:15px 15px 0 20px; margin:0;
}

#main-wrapper ul {
	margin: 5px 0 5px 0; 
	padding : 0; 
	list-style : none; 
	border-bottom: 0px solid #eee; 
	list-style-type: square;
	color: #a90000;
}

#main-wrapper li{
	margin: 0 0 2px 15px;
	padding: 0 0 0 0px;
	color: #555;
}

#main-wrapper a:hover {
}

.post {
margin:0 0 25px 0;
}
.post-title, .post-title a {
color:$colortitentrada;
}

.post-body {
}

.date-header {
 font: 85% Arial, Sans-Serif; margin: 0 0 10px 0px; padding: 0; color: #5f5f5f; background: inherit; border-bottom: 1px solid #2D8930;
}

.post-footer {
padding:2px 3px 3px 8px;
border:1px solid #e3e4e4;
background-color:#f5f5f5;
font-size:0.9em;
color:#505050;
}

/*-- (Lateral) --*/

#sidebar-wrapper {
        float: right;
	padding:0px 0 0 0; margin:0;
	background-image: url(http://lh5.ggpht.com/_7C4NVJJsAWU/SZFaCIbTWzI/AAAAAAAABQ8/GJx-JjrSd0c/sidebarbackground.jpg);
	width: 210px; 
}

#sidebar { text-align: left; 
        color: #7D8085; 
        font-size:0.97em;
        padding: 20px 0 0 0px; 
        width: 200px; 
}
#sidebar li { 
	margin: 5px 0 5px 0px; 
	padding: 0px 0 0 0px; 
	border-bottom: 1px dotted #ccc; 
	list-style: none;
}
#sidebar li a { 
 color: $colortextolateral;
 text-decoration: none;
 padding: 5px 0 0 0px;
 margin-bottom: 5px;
}

#sidebar li a:hover { 
 color: #075181;
 text-decoration: none;
 background: #E5F6FF;
 margin-bottom: 5px;
}

.sidebar .widget {
 margin-bottom: 20px;
}

/*-- (Pie de página) --*/

#footer-wrapper {
	clear:both;
        width: 985px;
	height: 43px;
	color:#ccc;  
	background: #000 url(http://lh3.ggpht.com/_7C4NVJJsAWU/SZCEYIjem4I/AAAAAAAABO4/4-OSTzunmiU/footerfinal.jpg) no-repeat top; 
	font-size:90%; 
	padding: 0; 
	text-align:center 
}

#footer-wrapper a { color: #E0F5FF; }

#footer-wrapper .links {
padding: 10px 0px 0px 0px; 
}

/*-- (ICONOS) --*/

.date-header {
padding-left: 15px;
background: url(http://bp0.blogger.com/_Zuzii37VUO4/RlXuS5yaz8I/AAAAAAAABf8/lPnKpN8Vd4k/s1600/timeicon.gif) center left no-repeat;
}

.post-author {
padding-left: 15px;
background: url(http://bp3.blogger.com/_Zuzii37VUO4/RlXuBpyaz1I/AAAAAAAABfE/DFaeuXvDlR4/s1600/author.gif) center left no-repeat;
}

.comment-link {
padding-left: 15px;
background: url(http://bp3.blogger.com/_Zuzii37VUO4/RlXuSpyaz5I/AAAAAAAABfk/AbUwoyxiNoI/s1600/comments.gif) center left no-repeat;
}

.blog-feeds {
padding-left: 20px;
padding-top: 5px;
background: url(http://bp0.blogger.com/_Zuzii37VUO4/Rj7ME-MBRJI/AAAAAAAAAwM/IOo-YUYR5aM/s1600/icono-feed.gif) center left no-repeat;
}

]]></b:skin>
<link href='http://plantillasblogyweb.googlepages.com/estilos-blogger.css' rel='stylesheet' type='text/css'/>
<link href='http://plantillasblogyweb.googlepages.com/blogy-azul.css' rel='stylesheet' type='text/css'/>  </head>

  <body>
  <script type='text/javascript'>

var banner= new Array()

banner[0]=&quot;http://lh6.ggpht.com/_7C4NVJJsAWU/SZCPvilXBwI/AAAAAAAABPA/e0QfDJtLifg/header1.jpg&quot;
banner[1]=&quot;http://lh4.ggpht.com/_7C4NVJJsAWU/SZCRJiG9AAI/AAAAAAAABPI/6vSL0tdOYLM/header2.jpg&quot;
banner[2]=&quot;http://lh3.ggpht.com/_7C4NVJJsAWU/SZCRJ46PssI/AAAAAAAABPQ/a8r58jVAOJM/header3.jpg&quot;
banner[3]=&quot;http://lh3.ggpht.com/_7C4NVJJsAWU/SZClf2ff-tI/AAAAAAAABPc/jvGF5uXxyus/header4.jpg&quot;
banner[4]=&quot;http://lh3.ggpht.com/_7C4NVJJsAWU/SZClpk4At6I/AAAAAAAABPk/Aa5KHAWywQk/header5.jpg&quot;
banner[5]=&quot;http://lh6.ggpht.com/_7C4NVJJsAWU/SZClpqr_WGI/AAAAAAAABPs/RMNrSrFCBts/header6.jpg&quot;
banner[6]=&quot;http://lh5.ggpht.com/_7C4NVJJsAWU/SZClpsjuilI/AAAAAAAABP0/wvxPOSBe270/header7.jpg&quot;
banner[7]=&quot;http://lh5.ggpht.com/_7C4NVJJsAWU/SZCl1o0OENI/AAAAAAAABP8/pEV5lUC12m8/header8.jpg&quot;
banner[8]=&quot;http://lh6.ggpht.com/_7C4NVJJsAWU/SZCl1qETK1I/AAAAAAAABQE/Lz-u9CUrrJM/header9.jpg&quot;
banner[9]=&quot;http://lh5.ggpht.com/_7C4NVJJsAWU/SZCl1445NkI/AAAAAAAABQM/Pv6_o3HcA4M/header10.jpg&quot;
var random=Math.round(9*Math.random());

document.write(&quot;<style>&quot;);
document.write(&quot;#header {&quot;);
document.write(' background:url(&quot;' + banner[random] + '&quot;) no-repeat left TOP;');
document.write(&quot; }&quot;);
document.write(&quot;</style>&quot;);

</script>
  <div id='outer-wrapper'><div id='wrap2'>

    <!-- links para navegadores de texto -->
    <span id='skiplinks' style='display:none;'>
      <a href='#main'>ir a principal </a> |
      <a href='#sidebar'>Ir a lateral</a>
    </span>

<div id='top'>
	<div class='padding'>
		<a href='http://silverscreen87.blogspot.com/feeds/posts/default'>RSS</a>
	</div>
</div>

<!-- (Cabecera) -->
    <div id='header-wrapper'>
     <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Silver Screen (Header)' type='Header'/>
</b:section>
    </div>

<div id='subheader'>
	<div id='menu'>
	  <ul>
		<li class='page_item'><a href='http://silverscreen87.blogspot.com/'>Home</a></li>
		<li class='page_item'><a href='http://silverscreen87.blogspot.com/2005/01/filmarchiv.html'>Filmarchiv</a></li>
	  </ul>
	</div>
</div>

<!-- (Contenedor) -->	
    <div id='content-wrapper'>

<!-- (Principal) -->
      <div id='main-wrapper'>
        <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog-Posts' type='Blog'/>
</b:section>
      </div>

<!-- (Lateral) -->
      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='Über mich' type='Profile'/>
<b:widget id='LinkList1' locked='false' title='Blogroll' type='LinkList'/>
<b:widget id='LinkList2' locked='false' title='Links' type='LinkList'/>
<b:widget id='BlogArchive1' locked='false' title='Blog-Archiv' type='BlogArchive'/>
<b:widget id='Text3' locked='false' title='Bewertungsskala' type='Text'/>
<b:widget id='Text1' locked='false' title='Filmreviews' type='Text'/>
<b:widget id='Text2' locked='false' title='Serienreviews' type='Text'/>
<b:widget id='HTML1' locked='false' title='Besucher' type='HTML'/>
</b:section>
      </div>

<!-- Limpiar flotación-->
      <div class='clear'/>

    </div> <!-- fin de capa content-wrapper -->

<!-- (Pie de página) -->
    <div id='footer-wrapper'>
<!-- RECUERDA QUE ESTA PLANTILLA ES GRATUITA, POR FAVOR NO REMUEVAS LOS CREDITOS -->
  <p class='links'> Diseño por  
  <a href='http://www.free-css-templates.com/'>David Herreman</a> 
  | A <a href='http://www.blogger.com'>Blogger</a> por  
  <a href='http://blogandweb.com/'>Blog and Web</a></p>
    </div>

  </div></div> <!-- fin de capa outer-wrapper -->
</body>
</html>
Zum Vergrößern anklicken....

Hi,

zeig mal bitte die Browserausgabe des geparsten Codes (Ansicht -> Seitenquelltext anzeigen).

mfg Maik
 
Wenn ich dich jetzt richtig verstehe, liesse sich Punkt 1 und Punkt 3 durch ein gemeinsames Hintergrundbild für den äußersten DIV-Block fixen.

Je nachdem wo genau das Logo im Header platziert werden soll, käme hier eine relative oder absolute Positionierung in Betracht.

mfg Maik
 
Etwa so:

HTML: 
<div id='header-inner'>
    <div class='titlewrapper'>
        <h1 class='title'>Silver Screen</h1>
    </div>
    <img id="logo" src="" alt="" />
</div>
CSS: 
#header-inner { position:relative; }
#header-inner #logo { position:absolute; top:...px; left:...px; }


mfg Maik
 
Danke! Hat soweit funktioniert, nur gibt es jetzt da einen weissen Abschnitt unterhalb des Headers der nicht sein sollte...
Wie krieg ich den weg?
Wenn ich bei #header-inner den 250px padding-Wert auf 0px setze ist der weisse Abschnitt weg, doch leider dann auch die Headers...
 
Bei mir gibt es mit dem vorgeschlagenen Code unter dem Header keinen weißen Abschnitt.

mfg Maik
 
Ja wenn ich
PHP: 
padding: 250px 0 0 50px;
im #header-inner wegnehme, dann verschwindet der weisse Abschnitt, doch dann sind die Header auch nicht mehr sichtbar. Der weisse Abschnitt ist auf der Seite jetzt sichtbar.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück