Navi über Hauptbereich

Allgemeine Fragen zu diversen Homepagebaukästen und Webspaces

Moderatoren: HTML-Laie, Jasko

Antworten
Benutzeravatar
Patrick
Grosser Webmaster
Grosser Webmaster
Beiträge: 732
Registriert: Mi 21. Jul 2010, 15:55
Mein Vorname: Patrick
Wohnort: Bei Münster
Kontaktdaten:

Navi über Hauptbereich

Beitrag von Patrick »

Hallo,

und wieder ein neues Problem.

Hab es geschafft mit der Navi auf der linken seite. Allerdings überlappt sie den Hauptberei
und verdeckt dein Inhalt der seiten. Wie bekomme ich das weg bzw. wo kann ich es abändern?

http://pixelshoots.oyla.de/cgi-bin/hpm_homepage.cgi

LG
Patrick
Benutzeravatar
Paulus
Erfahrener Forengänger
Erfahrener Forengänger
Beiträge: 51
Registriert: Do 27. Mai 2010, 16:26
Mein Vorname: Paul

Re: Navi über Hauptbereich

Beitrag von Paulus »

du musst die Navi in einen Div ablegen und diesen float:left einstellen, damit sie nach links zieht.

Sieht eh ein bissle zerschossen aus dein design. :E
Benutzeravatar
Patrick
Grosser Webmaster
Grosser Webmaster
Beiträge: 732
Registriert: Mi 21. Jul 2010, 15:55
Mein Vorname: Patrick
Wohnort: Bei Münster
Kontaktdaten:

Re: Navi über Hauptbereich

Beitrag von Patrick »

na toll, und wie mache ich das?
Hab das layout von hier
http://www.dynamicdrive.com/style/layou ... xed-fixed/

Was meinst du es sieht zerschossen aus?

lg
Benutzeravatar
Patrick
Grosser Webmaster
Grosser Webmaster
Beiträge: 732
Registriert: Mi 21. Jul 2010, 15:55
Mein Vorname: Patrick
Wohnort: Bei Münster
Kontaktdaten:

Re: Navi über Hauptbereich

Beitrag von Patrick »

Ist doch in einem div drin, wenn ich das richtig sehe

Code: Alles auswählen

<!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" lang="en" xml:lang="en">
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <title></title>
   <style type="text/css">
   
   body{
   margin:0;
   padding:0;
   background-color: #39C6DE;
   background-image: url(http://i55.tinypic.com/nva4oj.png);
   background-attachment: fixed;
   background-repeat: repeat;
   
   line-height: 1.5em;
   }
   
   b{font-size: 110%;}
   em{color: red;}
   
   #maincontainer{
   width: 900px; /*Width of main container*/
   margin: 0 auto; /*Center container on page*/
   }
   
   #header{
   background: #EAEAEA;
   background-image: url();
   height: 150px; /*Höhe des Headers*/
   margin-top: 30px;
   margin-bottom: 0px;
   }
   
   
   /*Navileiste Anfang*/
   
   
   
   /*- Menu Tabs oben */
  
   #tabs14 {
   font: bold 11px/1.5em Verdana;
   float:left;
   width:100%;
   background:change-background;
   line-height:normal;
   }
  
   #tabs14 ul {
   margin:0;
   padding:10px 10px 0 50px;
   list-style:none;
   }
  
   #tabs14 li {
   display:inline;
   margin:0;
   padding:0;
   }
  
   #tabs14 a {
   float:left;
   background:url("http://i55.tinypic.com/213m9s0.gif") no-repeat left top;
   margin:0;
   padding:0 0 0 4px;
   text-decoration:none;
   }
  
   #tabs14 a span {
   float:left;
   display:block;
   background:url("http://i55.tinypic.com/214wpkj.gif") no-repeat right top;
   padding:5px 15px 4px 6px;
   color:#666;
   }
  
   /* Commented Backslash Hack hides rule from IE5-Mac \*/
   #tabs14 a span {float:none;}
   /* End IE5-Mac hack */
   #tabs14 a:hover span {
   color:#000;
   }
  
   #tabs14 a:hover {
   background-position:0% -42px;
   }
  
   #tabs14 a:hover span {
   background-position:100% -42px;
   }
   
   
   
   
   /*Navileiste Ende*/
   
   
   
   #topsection h1{
   margin: 0;
   padding-top: 15px;
   }
   
   #hauptbereich{
   float: left;
   width: 100%;
   height: 650px;
   margin-bottom: 30px;
   background-color: #ffffff;
   background-image: url(http://i55.tinypic.com/am9phc.gif);
   }
   
   #contentcolumn{
   margin: 0 190px 0 180px; /*Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth*/
   }
   
   
   #linkespalte{
   background: none repeat scroll 0 0 #;
   float: left;
   width: 200px; /*breite linke navigation*/
   margin-left: -900px;
   background: #;
   background-image: url();
   margin-bottom: 20px;
   }
   
   
   
   
   
   
   
   
   
   
   
   
   /*Navi Links Anfang*/
   
   #menu8 {
   width: 200px;
   margin-top: 10px;
   float: left;
   }
   
   #menu8 li a {
   text-decoration: none;
   height: 32px;
   voice-family: "\"}\"";
   voice-family: inherit;
   height: 24px;
   }
   
   #menu8 li a:link, #menu8 li a:visited {
   color: #777;
   display: block;
   background: url(http://i55.tinypic.com/xp925i.gif);
   padding: 8px 0 0 20px;
   }
   
   #menu8 li a:hover {
   color: #257EB7;
   background: url(http://i55.tinypic.com/xp925i.gif) 0 -32px;
   padding: 8px 0 0 25px;
   }
   
   #menu8 li a:active {
   color: #fff;
   background: url(http://i55.tinypic.com/xp925i.gif) 0 -64px;
   padding: 8px 0 0 25px;
   }
   
   #menu8 ul {
   list-style: none;
   margin: 0;
   padding: 0;
   }
   
   /*Navi Links Ende*/
   
   
   #footer{
   clear: none;
   width: 900px;
   height: 50px;
   background: black;
   color: #000;
   text-align: center;
   padding: 10px 0;
   background-image: url(http://i55.tinypic.com/am9phc.gif);
   margin-right: auto;
   margin-left: auto;
   margin-top: 50px;
   margin-bottom: 20px;
   }
   
   
   #footer a{
   color: #000000;
   
   }
   
   
   
   
   </style>
   
   
   
   </head>
   <body>
   
   
   
   
   
   <div id="maincontainer">
   
   <div id="header">
   
   
   
   
   
   
   <div class="innertube"></div></div>
   
   
   
<div id="tabs14"> 
<ul> 
<li>
<a href="#" title="Link 1"><span>Link 1</span></a></li> 

<li><a href="#" title="Link 2"><span>Link 2</span></a></li> 

<li><a href="#" title="Link 3"><span>Link 3</span></a></li> 

<li><a href="#" title="Longer Link Text"><span>Longer Link Text</span></a></li> 

<li><a href="#" title="Link 5"><span>Link 5</span></a></li> 

<li><a href="#" title="Link 6"><span>Link 6</span></a></li> 

<li><a href="#" title="Link 7"><span>Link 7</span></a></li> </ul> 

</div>
   
   
   
   
   <div id="hauptbereich">
   
   %content%
   
   <div id="contentcolumn">

   <div class="innertube">

   </div>
   </div>
   </div>
   
   <div id="linkespalte">
   
   
   
   
   
   <div id="menu8">
   <ul>
   <li><a href="#1" title="Home">Start</a></li>
   <li><a href="#2" title="About">Seite 2</a></li>
   <li><a href="#3" title="Services">Seite 3</a></li>
   <li><a href="#4" title="Portfolio">Seite 4</a></li>
   <li><a href="#5" title="Store">Seite 5</a></li>
   <li><a href="#6" title="Download">Seite 6</a></li>
   <li><a href="#7" title="About">Seite 7</a></li>
   <li><a href="#8" title="Services">Seite 8</a></li>
   <li><a href="#9" title="Portfolio">Seite 9</a></li>
   <li><a href="#10" title="Store">Seite 10</a></li>
   <li><a href="#11" title="Download">Seite 11</a></li>
   </ul>
   </div>
   
   
   

   <div class="innertube">
   
   </div>
   
   </div>
   
   
   <div class="innertube">
   </div>
   </div>
   
   <div id="footer">
   Name | Kontakt | Impressum
   </div>
   
   </div>
   </body>
   </html>
Antworten

Zurück zu „Andere Homepageanbieter“

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 17 Gäste