css_noob: css Anfänger braucht hilfe!

Beitrag lesen

Hallo,
ich habe zwei Probleme bezüglich der Vorlage.

  1. Wie bekomme ich den Abstand zwischen h2 (Schrift 1) und p (Das ist ein normaler Text) weg.
  2. Wieso bricht die Überschrift1 so seltsam um, wenn man den Browser kleiner macht.

Danke und Gru0

  
<!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">  
<head>  
<title>CSS Test</title>  
<meta name="description" content="" />  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  
  
<link rel="stylesheet" href="stylesheet.css" type="text/css"/>  
  
<style type="text/css">  
<!--  
body { font:15px Arial,sans-serif; line-height:1.4em; background:#ffffff; }  
#container { width:98%; text-align:left; background:#ffffff; color:#303030; }  
#header {height:100px; width:99%; background: #999999; color:#ffffff;}  
#header h1{font-size:2.4em; padding: 10px 10px 10px 10px; background-color:inherit; color:#ffffff; letter-spacing:-2px; font-weight:normal; }  
#header h2 {font-size:1.4em; padding: 10px 10px 10px 10px;background-color:inherit; color:#f0f2f4; letter-spacing:-1px; font-weight:normal;}  
#header h3 {font-size:1.4em; background-color:inherit; color:#f0f2f4; letter-spacing:-1px; font-weight:normal;}  
#content{ float:left; width:60%; font-size:0.9em;}  
#content h2{ color: #222222; border-bottom: 1px dotted #CCCCCC;  font: normal 190%/100% Arial,Tahoma,sans-serif; padding-bottom: 0px;background: #666666;}  
#content p{ color: #222222; background: #999999; font: normal 170%/100% Arial,Tahoma,sans-serif;}  
#right{ float:right; width:35%; padding: 10px 5px 10px 0; line-height:1.4em;}  
#right h2{background: #ffffff; margin: 0 10px 0 0; font-family: Verdana,Arial,Tahoma,sans-serif; font-size: 11px; font-weight: bold; color: #444444; padding: 5px 8px 5px 10px;}  
-->  
</style>  
</head>  
<body>  
<div id="container" >  
  
<div id="header">  
<h1>Überschrift1 dies ist eine sehr lange schrift</h1>  
<h2>Überschrift2</h2>  
</div>  
<br/>  
<div id="content">  
<h2>Schrift 1</h2>  
<p>Das ist ein normaler Text</p>  
<br/></div>  
<div id="right">  
<div id="avmenu">  
<h2>Schöne Fotos</h2>  
<br/><br/>  
<br/><br/>  
</div>  
<br/>  
</div>  
</body>  
</html>