Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 11

Thema: Hilfe bei Menü-Einbindung - andere Foren können nicht helfen

  1. #1
    Youngster
    Registriert seit
    07.07.2008
    Beiträge
    15
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Hilfe bei Menü-Einbindung - andere Foren können nicht helfen

    geht um ein menü, das nicht mittig werden will... reagiert nicht auf margin auto...wäre euch so unendlich dankbar wenn ihr mir helfen könnt...

    Also bitte schaut euch mal genau den Code an, ich habe die ganze Seite auseinandergebaut damit man alles einfach anschauen kann, vllt. findet ihr ja meinen Fehler, warum das verdammte Menü auf http://www.hiphop-sms.com/index.html einfacher nicht mittig werden will.

    das hier ist der komplette html code der unterseite, um die es geht:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    
    <HTML>
    <HEAD>
    <TITLE>Free-SMS für die Hiphop-Community: Hiphop-SMS.com | Home</TITLE>
    
    
    <META NAME="description" content="Free-SMS Dienst für die Hiphop Community. Außerdem gibt's ein Rap Radio, Rnb Radio, Hiphop Radio sowie eine topaktuelle Hiphop-News Seite.">
    <META NAME="keywords" content="hiphop-sms, free-sms, free, sms, freesms, freisms, hiphop, rap radio, rap-radio, hiphop radio, rnb radio, r&b radio, rap, rnb, r'n'b, rap news, rap-news, hiphop news, hiphopper, kostenlos, gratis, frei, sms-versand, smsversand, versand, frei-sms, kostenlose sms, news">
    <META NAME="Content-Language" content="de">
    <META NAME="author" content="Björn Assmann">
    <META NAME="ROBOTS" CONTENT="INDEX, FOLLOW">
    <meta name="robots" content="all">
    <meta name="revisit-after" content="5 days" />
    <meta name="distribution" content="global">
    <meta name="language" content="de">
    <meta name="verify-v1" content="9DAGfZ1tci4sEJRT9MaPHojcOyyhm5vLjBLGhu6omkA=" />
    <link rel="stylesheet" type="text/css" href="style.css">
    <!--[if lt IE 7]>
        <link rel="stylesheet" type="text/css" href="lt_ie7.css">
    <![endif]-->
    <link rel="icon" type="image/ico" href="fav.ico" />
    
    <script language="JavaScript1.2">
    var bookmarkurl="http://www.hiphop-sms.com"
    var bookmarktitle="Hiphop-SMS.com - FREE SMS für alle"
    function addbookmark(){
    if (document.all)
    window.external.AddFavorite(bookmarkurl,bookmarktitle)
    }
    
    s2i_uid = 38;
    </script>
    </HEAD>
    <BODY>
    
    
    
    
      <div id="bookmarks">
      
     
        
     
       
         </div>
    
    
    
    
    <div id="impressum">
      Impressum
    </div>
    
      <div id="header">
        <div id="logo"></div>
      </div>
    
      <div id="all">
       
          <div id="pro11" style="margin:auto">
            <ul>[*]<h1>Free SMS</h1>[*]<h1>Rap-Radio</h1>[*]<h1>R&B-Radio</h1>[*]<h1>Hiphop News</h1>[*]<h1>Paid SMS</h1>[/list]
          </div>
          </div>
    
    
     
     
     
    <div id="footer2">  
      Copyright bei Hiphop-SMS | Version 0.01 | Impressum
    
    </div>
    
    </BODY>
    </HTML>
    und hier das komplette domain style sheet, die relevanten tags sind ganz oben (body) und ganz unten (ul pro11):

    Code:
    body {
    background : url(hintergrund.png);
    background-repeat : no-repeat;
    background-color : #000000;
    margin-top : 0;
    margin-bottom : 0;
    font-family : Arial;
    font-size : 12px;
    text-align : center;
    }
    a:link {
    color : #000000;
    text-decoration : underline;
    }
    a:visited {
    color : #000000;
    text-decoration : underline;
    }
    a:hover {
    color : #cd0000;
    text-decoration : underline;
    }
    a:active {
    color : #cd0000;
    text-decoration : underline;
    }
    a:focus {
    color : #cd0000;
    text-decoration : underline;
    }
    .white:link {
    color : #ffffff;
    text-decoration : none;
    }
    .white:visited {
    color : #ffffff;
    text-decoration : none;
    }
    .white:hover {
    color : #cd0000;
    text-decoration : underline;
    }
    .white:active {
    color : #cd0000;
    text-decoration : underline;
    }
    .white:focus {
    color : #cd0000;
    text-decoration : underline;
    }
    h1 {
    font-size : 14px;
    font-weight : bold;
    text-align : center;
    }
    #logo {
    width : 463px;
    height : 58px;
    margin : auto;
    border : 0 solid;
    background-image : url(logo.png);
    }
    #counter {
    visibility : hidden;
    }
    #impressum {
    position : fixed;
    right : 15px;
    top : 10px;
    }
    #header {
    text-align : center;
    margin-top : 30px;
    margin-bottom : 20px;
    }
    #all {
    background-color : #ffffff;
    width : 80%;
    border-width : 0;
    text-align : center;
    margin : auto;
    }
    #main {
    text-align : left;
    margin-left : 20px;
    margin-right : 20px;
    margin-top : 0;
    margin-bottom : 20px;
    }
    .navlist ul {
    margin-left : 0;
    padding-left : 0;
    white-space : nowrap;
    }
    .navlist li {
    display : inline;
    list-style-type : none;
    }
    .navlist a {
    padding : 3px 10px;
    }
    .navlist a:link, .navlist a:visited {
    color : #ffffff;
    background-color : #000000;
    text-decoration : none;
    }
    .navlist a:hover {
    color : #ffffff;
    background-color : #cd0000;
    text-decoration : none;
    }
    * {
    margin : 0;
    padding : 0;
    }
    #divs_nebeneinander {
    min-height : 1%;
    }
    * html #divs_nebeneinander {
    height : 1%;
    }
    #div1 {
    width : 20%;
    float : left;
    text-align : right;
    }
    #div2 {
    background-color : #cd0000;
    width : 60%;
    float : left;
    text-align : center;
    }
    #div2unten {
    height : 228px;
    margin : 15px;
    font-weight : bold;
    text-align : left;
    }
    #div3 {
    width : 20%;
    float : left;
    text-align : left;
    }
    .clear {
    clear : both;
    }
    #footer {
    margin-top : 30px;
    margin-bottom : 0;
    text-align : center;
    }
    #footer2 {
    margin-top : 20px;
    margin-bottom : 20px;
    color : #ffffff;
    }
    .rss_box {
    margin : 1em;
    width : 350px;
    background-color : #663333;
    border : 0 solid #5f74cc;
    }
    p.rss_title {
    padding : 0.5em;
    }
    .rss_title {
    text-decoration : none;
    font-family : verdana, sans-serif;
    font-size : 85%;
    background-color : #3399cc;
    color : #ffffff;
    font-weight : bold;
    margin : 1px;
    padding : 0;
    text-align : left;
    }
    .rss_item {
    color : #ffffff;
    font-family : verdana, arial, sans-serif;
    font-size : 0.85em;
    font-weight : normal;
    list-style : none;
    padding-bottom : 1em;
    }
    .rss_item a {
    color : #ffffff;
    font-size : 105%;
    font-weight : bold;
    font-family : arial, sans-serif;
    }
    .rss_item a:visited {
    color : #cd0000;
    }
    .rss_date {
    font-size : 85%;
    font-weight : normal;
    color : #ffffff;
    }
    table.lfmWidgetradio_40984b0256707945e6cdbddcf5bced5d td {
    margin : 0 !important ;
    padding : 0 !important ;
    border : 0 !important ;
    }
    table.lfmWidgetradio_40984b0256707945e6cdbddcf5bced5d tr.lfmHead a:hover {
    background : url(http://cdn.last.fm/widgets/images/de/header/radio/regular_black.png) no-repeat 0 0 !important ;
    }
    table.lfmWidgetradio_40984b0256707945e6cdbddcf5bced5d tr.lfmEmbed object {
    float : left;
    }
    table.lfmWidgetradio_40984b0256707945e6cdbddcf5bced5d tr.lfmFoot td.lfmConfig a:hover {
    background : url(http://cdn.last.fm/widgets/images/de/footer/black_np.png) no-repeat 0 0 !important ;
    }
    table.lfmWidgetradio_40984b0256707945e6cdbddcf5bced5d tr.lfmFoot td.lfmView a:hover {
    background : url(http://cdn.last.fm/widgets/images/de/footer/black_np.png) no-repeat -85px 0 !important ;
    }
    table.lfmWidgetradio_40984b0256707945e6cdbddcf5bced5d tr.lfmFoot td.lfmPopup a:hover {
    background : url(http://cdn.last.fm/widgets/images/de/footer/black_np.png) no-repeat -159px 0 !important ;
    }
    #bookmarks {
    background-color : #000000;
    position : fixed;
    left : 10px;
    top : 10px;
    padding : 5px;
    border : 1px solid;
    border-color : #cc0000;
    }
    #pro11 ul {
    margin: 0 auto;
    padding : 0;
    list-style : none;
    white-space : nowrap;
    list-style : none;
    height : 35px;
    position : relative;
    background : #fff;
    font-size : 11px;
    }
    #pro11 li {
    margin : 0 1px 0 0;
    padding : 0;
    float : left;
    }
    #pro11 li a {
    display : block;
    float : left;
    height : 35px;
    line-height : 20px;
    color : #ddd;
    text-decoration : none;
    font-family : arial, verdana, sans-serif;
    font-weight : bold;
    text-align : center;
    padding : 0 0 0 10px;
    cursor : pointer;
    background : url(pro_11_0a.gif) no-repeat;
    }
    #pro11 li a b {
    float : left;
    display : block;
    padding : 0 25px 15px 15px;
    background : url(pro_11_0b.gif) no-repeat right top;
    }
    #pro11 li.current a {
    color : #fff;
    background : url(pro_11_2a.gif) no-repeat;
    line-height : 23px;
    }
    #pro11 li.current a b {
    background : url(pro_11_2b.gif) no-repeat right top;
    padding-bottom : 12px;
    }
    #pro11 li a:hover {
    color : #fff;
    background : url(pro_11_1a.gif) no-repeat;
    line-height : 23px;
    }
    #pro11 li a:hover b {
    background : url(pro_11_1b.gif) no-repeat right top;
    padding-bottom : 12px;
    }
    #pro11 li.current a:hover {
    color : #fff;
    background : url(pro_11_2a.gif) no-repeat;
    cursor : default;
    }
    #pro11 li.current a:hover b {
    background : url(pro_11_2b.gif) no-repeat right top;
    }
    bitte bitte bitte tut mir den gefallen, und schaut euch mal den code an, was falsch ist, ich versteh es nicht und ein hinweis auf den html/css validator helfen mir auch nicht weiter (zumal das css hab ich grad letzt erst validiert)

    bin leider ein ziemlicher noob, hab nur grundkenntnisse
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Geändert von hijacker (20.11.2008 um 14:27 Uhr) Grund: damit hier nicht auf eine seite verlinkt wird die nicht existiert => schlecht, wird mir in den WMT angezeigt

  2. #2
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    dein div mit der ID proll sollte ne breite bekommen die dann auch ein margin: 0 auto verträgt!
    habs mit margin:0 auto; und width:70% hinbekommen, dass des menü zentriert ist!
    und nimm da den shice element-style raus und mach des über das externe stylesheet, is einfacher zu pflegen!
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    hijackerNICHTEINGELOGGT
    Gast

    Standard

    hi, habs ausprobiert und wollt mich schon überschwenglich bedanken aber habs nicht hingekriegt. bei 70% ist es bei mir bei 1280x800 nicht exakt mittig (man siehts mit bloßem auge) und auf 1024x768 ist es sowieso ein kuddelmuddel (das eine tab haut ab in die 2. zeile).

    kannst du mir eventuell, wenn bei dir diese probleme nicht auftreten per pn oder hier in den thread den code schreiben (css code vorallem) mit dem du des geschafft hast? dafür wäre ich extrem dankbar... bin eh schon dankbar, dass sich überhaupt jmd die mühe gemacht hat das problem genauer annzuschauen.

  4. #4
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    ja dann setz dich mal hin und bring den ausgangszustand wieder zurück...
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  5. #5
    hijackerNICHTEINGELOGGT
    Gast

    Standard

    welchen ausgangszustand? habe meinen post oben nicht verändert... (sorry dass ich so dumm frage, bin noob)

  6. #6
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard

    ich meine den zustand deiner website, da waren grad noch grafiken fürs menü..
    und die änderungen die ich gemacht hatte waren getestet via firebug (addon für den FF)

    da hab ich alle element-styles weggemacht und eben margin:0 auto; und width:70% eingefügt
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  7. #7
    hijackerNICHTEINGELOGGT
    Gast

    Standard okay

    ah okay danke, ich probiers nochma (und stell sonst den ausgangszustand wieder her), dauert aber wohl bis heut abend bis ich dazu komme...

  8. #8
    Youngster
    Themenstarter

    Registriert seit
    07.07.2008
    Beiträge
    15
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    okay hoffe habe den richtigen zustand hergestellt, ist jetzt mit 70% nur funktionierts nicht bei mir... (bei verschiedenen auflösungen sind verschiedenviele dinger in der 2. zeile.. glaub hab jetzt sogar noch nen fehler zusätzl. reingebaut, weil vorher gings wenigstens bei einer der auflösungen (s.o.)... wäre so dankbar... wenns noch nen tipp gäbe... hier nochmal die url: http://www.hiphop-sms.com/index2.html

  9. #9
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Mal ein paar grundsätzliche Überlegungen, ohne jetzt eine Gesamtlösung parat zu haben:

    Wenn du eine Breite von 70% verwendest (oder auch ein beliebiger anderer Prozentwert):
    Dann ist doch die Navi je nach Bildschirmbreite ebenfalls immer unterschiedlich breit. Andere Bildschirme --->> andere Navibreiten.
    Die Links haben aber eine feste Breite.
    Folge: Sie werden immer in unterschiedliche (prozentuale) Gesamtbreiten eingebunden und können so nie richtig zentriert sein oder der prozentuale Platz reicht noch nicht mal aus, um sie nebeneinander darzustellen.

    Deshalb folgender Lösungsansatz:
    Verwende für die Navi feste Pixelwerte.
    Ich hatte in einem anderen Zusammenhang mal was ähnliches gebastelt und da ist etwas Rechenarbeit angesagt:
    Zunächst ermittelst du die Anzahl der Links. Diesen gibst du eine bestimmte, einheitliche Pixelbreite. Unter Berücksichtigung von evtl. Border-, Margin- und Paddingwerten ermittelst du die Gesamtbreite der einzelnen Links.
    Diese verwendest du für ul. Und ul zentrierst du in dem Navi-Div.

    Ich poste hier mal dieses Beispiel, das du dann an deine spezifischen Verhältnisse mit anderen Pixelwerten anpassen müsstest.

    CSS:
    Code:
    #navi &#123; 
      width&#58; 898px; 
      height&#58; 1.8em; 
      background-color&#58;#EBECE4; 
      border-left&#58; 1px solid #4D4D4D; 
      border-right&#58; 1px solid #4D4D4D; 
     margin&#58; 0 auto;
    &#125; 
    
    #navi ul &#123; 
      width&#58; 605px; 
      margin&#58; 0 auto; 
      list-style-type&#58; none; 
      line-height&#58; 1.8em; 
      text-align&#58; center; 
    &#125; 
    
    #navi li &#123; 
      float&#58; left; 
      border-right&#58; 1px solid #4D4D4D; 
    &#125; 
    
    #navi a &#123; 
      width&#58; 150px; 
      display&#58; block; 
      text-decoration&#58; none; 
      color&#58; #4D4D4D; 
    &#125; 
    
    #navi li a&#58;hover &#123; 
      color&#58; #0000CD; 
      background-color&#58; #C1CDCD; 
    &#125;
    HTML
    Code:
    <div id="navi"> 
        <ul> 
          <li style="border-left&#58; 1px solid #4D4D4D;">Home [*]Link 1 [*]Link 2 [*]Link 3 [/list]
      </div>

  10. #10
    Youngster
    Themenstarter

    Registriert seit
    07.07.2008
    Beiträge
    15
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    DANKE DANKE LEUTE - ICH HABS HINGEKRIEGT DURCH ALLES IN PIXEL ANGEBEN. Ich bin euch so dankbar! - Noch eine Frage: Müsste es nicht auch gehen, wenn ich alles in % angebe, also auch die einzelnen links?

Ähnliche Themen

  1. Flash Einbindung nicht valide
    Von sero79 im Forum HTML & CSS Forum
    Antworten: 14
    Letzter Beitrag: 09.07.2008, 22:39
  2. Variablen können nicht ausgegeben werden.
    Von guest_ im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 11
    Letzter Beitrag: 06.06.2008, 23:06
  3. Antworten: 1
    Letzter Beitrag: 27.02.2008, 17:28
  4. hilfe!! flash menü funktioniert nicht in html!!
    Von pragia im Forum Flash Forum
    Antworten: 13
    Letzter Beitrag: 06.10.2007, 12:11
  5. Bitte nochmal um hilfe in sachen script einbindung
    Von Tanaka666 im Forum HTML & CSS Forum
    Antworten: 14
    Letzter Beitrag: 21.02.2006, 07:53

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •