mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Mi 24.04.2024 07:03 Benutzername: Passwort: Auto-Login

Thema: Anker springen im FF richtig - im IE nicht! vom 06.01.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Anker springen im FF richtig - im IE nicht!
Autor Nachricht
franca
Threadersteller

Dabei seit: 19.06.2006
Ort: München
Alter: -
Geschlecht: Weiblich
Verfasst Di 06.01.2009 17:06
Titel

Anker springen im FF richtig - im IE nicht!

Antworten mit Zitat Zum Seitenanfang

Hallo!

Ich habe von dieser Seite:
http://limpid.nl/lab/css/fixed/header-and-left-sidebar
einen Code, der den content-Bereich scrollbar macht. Mein Problem: innerhalb des Contents befinden sich Anker. Wenn ich diese normal setze, scheint er das, was ich bereits definiert habe als "wo der content starten soll"

body{

margin:0;
padding:header-<length> 0 0 left-sidebar-<length>;
}

nicht mehr zu akzeptieren und setzt den anker ganz oben also bei padding-top=0 an.
Somit springt er zwar zum richtigen Anker, der aber dann durch den header praktisch überdeckt wird.

Ich wollte das Problem lösen, indem ich dem Anker einfach ein eigenes Padding gegeben habe:
<a name="werbung" id="werbung" style="padding-top:170px;"></a>

Das funktioniert toll im Firefox - dafür überhaupt nicht im InternetExplorer!! Meine Güte!

Hat jemand eine Lösung??
  View user's profile Private Nachricht senden
xBe

Dabei seit: 04.06.2006
Ort: Mönchengladbach
Alter: 34
Geschlecht: Männlich
Verfasst Di 06.01.2009 17:32
Titel

Antworten mit Zitat Zum Seitenanfang

Zeig uns mal den Link deiner Seite, ob du auch alles richtig eingebaut hast.!
  View user's profile Private Nachricht senden
Anzeige
Anzeige
franca
Threadersteller

Dabei seit: 19.06.2006
Ort: München
Alter: -
Geschlecht: Weiblich
Verfasst Di 06.01.2009 18:37
Titel

Antworten mit Zitat Zum Seitenanfang

Oh je....Die ist leider noch nicht online!!!! Aber ich hab mal hier eine "abgespeckte" Varainte, mit der auch schon das Problem auftaucht..... (Den Blindtext muss man durch VIEL Blindtext ersetzen, damit auch ein Scrollbalken zustande kommt Lächel )

Hier css:

Code:
body{
font-family: Arial, Helvetica, sans-serif;
font-size:0.8em;
color: #424242;
background-color:#ffffff;
overflow:-moz-scrollbars-vertical;

  margin:0;
  padding:121px 0 0 220px;

}


/*-------------fixed bereiche ----------------------------------------------------------*/

 div#header{

  position:absolute;
  top:0;
  left:0;
  width:500%;
  height:111px;
  background-color:#FFF;
 }
 

 
  div#content {
   
     width: 816px;
      height:100%;

    }
   
 div#left-sidebar{

  position:absolute;
  top:111px;
  left:0;
  width:208px;
  height:100%;

 }
 

 
 @media screen{
  body>div#header{
   position:fixed;
  }
  body>div#left-sidebar{
   position:fixed;
  }

 * html body{
  overflow:hidden;
 }
 * html div#content{
  height:100%;
  overflow:auto;
 }



/*-------------end fixed bereiche-------------------------------------*/



Und html:
Code:
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<div id="header">
    <img src="Bilder/Bild_01.gif" width="1024" height="111" /></div>

 <div id="left-sidebar">
   <?php include("navigation_zu.php"); ?></div>
   
    <div id="content">
          <a name="oben" id="oben" style="padding-top:200px;"></a>
                Überschrift 1<br />
                            <br />
               BLINDETXT.....
            <div align="right"><a href="#oben"><img src="Bilder/oben.gif" width="16" height="13" border="0" align="absmiddle"/> nach oben</a></div>
              Überschrift 2<br />
                        <br />
                 BLINDETXT.....
           <div align="right"><a href="#oben"><img src="Bilder/oben.gif" width="16" height="13" border="0" align="absmiddle"/> nach oben</a></div>
               Überschrift 3<br />
                        <br />
                 BLINDETXT.....
          <div align="right"><a href="#oben"><img src="Bilder/oben.gif" width="16" height="13" border="0" align="absmiddle"/> nach oben</a></div>
              Überschrift 4<br />
                            <br />
                 BLINDETXT.....
           <div align="right"><a href="#oben"><img src="Bilder/oben.gif" width="16" height="13" border="0" align="absmiddle"/> nach oben</a></div>
 
<br/></div>
</body>


Zuletzt bearbeitet von franca am Di 06.01.2009 18:39, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
franca
Threadersteller

Dabei seit: 19.06.2006
Ort: München
Alter: -
Geschlecht: Weiblich
Verfasst So 11.01.2009 22:10
Titel

Antworten mit Zitat Zum Seitenanfang

Habe nun weiter gegoogelt und da bin ich dann genau auf mein Problem gestoßen:
http://molily.de/css-position-fixed

Nur leider scheint da niemand den Internet Explorer zu beücksichtigen... * Nee, nee, nee * und außerdem scheinen diese Tipps BEI MIR jedenfalls nicht zu funktionieren.. hab mal alle bis auf die javascript-Geschichten auprobiert... funktioniert irgendwie gar net....argh!!!! * Ich geb auf... * entweder ich stell mich an oder es gibt einfach keine optimale Lösung dafür!!! menno! und HHÜÜÜÜÜLFÄÄÄ!


Zuletzt bearbeitet von franca am So 11.01.2009 22:11, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen Im Iframe zu Anker springen
dynamischer scroll von anker zu anker
hin und her springen der Seite verhindern via CSS
[IE6 CSS Bug] boxen springen bei hover
Springen bei refresh verhindern
PDF-Anker?
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.