AGB  ·  Datenschutz  ·  Impressum  







Anmelden
Nützliche Links
Registrieren
Zurück Delphi-PRAXiS Programmierung allgemein Programmieren allgemein [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalken

[HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalken

Ein Thema von Matze · begonnen am 9. Mär 2010 · letzter Beitrag vom 10. Mär 2010
Antwort Antwort
Seite 1 von 3  1 23   
Benutzerbild von Matze
Matze
(Co-Admin)

Registriert seit: 7. Jul 2003
Ort: Schwabenländle
14.929 Beiträge
 
Turbo Delphi für Win32
 
#1

[HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalken

  Alt 9. Mär 2010, 10:59
Hallo zusammen,

ich nutze Code wie diesen:

Code:
<div style="width: 900px; position: relative; margin: auto">
    <span style="position: absolute; width: 200px; left: -150px; z-index: 3"></span>
</div>
Der Sinn dahinter ist egal, ich brauche das so.

Bei einer Auflösung von 1024 x 768 führt das zu einem horizontalen Scrollbalken. Kann man das span-Element irgendwie so einstellen, dass es keinen horizontalen Scrollbalken erzeugt?
Ein "overflow: hidden" beim div-Element verhindert die Scrollbalken, allerdings auch dann, wenn das Browserfenster kleiner als 900 Pixel breit ist. Ich hätte es gerne so, dass das div-Element immer komplett erreichbar ist, ggf. mit Scrollbalken. Nur für das span-Element soll dieser nicht auftauchen.
Wenn ich das span- zum div-Element mache mit "overflow: hidden" funktioniert es auch nicht.

Grüße, Matze
  Mit Zitat antworten Zitat
Benutzerbild von s.h.a.r.k
s.h.a.r.k

Registriert seit: 26. Mai 2004
3.159 Beiträge
 
#2

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 13:04
Ich hatte auch mal so ein ähnliches Problem, wobei ich das dann quick-and-dirty so gelöst hatte, dass ich innerhalb des divs noch ein div positioniert habe, mit minimalster Breite (1px oder 0px). Diesem div habe ich dann overflow:hidden gegeben und darin alle Elemente platziert, in deinem Fall die spans.

Zusätzliches Vorteil der Lösung ist, dass du dem "Container-div" auch noch eine ID/Klasse geben kannst und die Elemente darin noch etwas mehr kapselst, wobei das Geschmackssache ist.

So meine ich das ganze:
Code:
<div style="width: 900px; position: relative; margin: auto">
    <div style="width: 1px; position: absolute; left: 0; top: 0; overflow: hidden;">
        <span style="position: absolute; width: 200px; left: -150px; z-index: 3"></span>
    </div>
</div>
»Remember, the future maintainer is the person you should be writing code for, not the compiler.« (Nick Hodges)
  Mit Zitat antworten Zitat
Benutzerbild von Matze
Matze
(Co-Admin)

Registriert seit: 7. Jul 2003
Ort: Schwabenländle
14.929 Beiträge
 
Turbo Delphi für Win32
 
#3

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 13:26
Hm, danke für den Trick. Allerdings sehe ich vom span-Element dann nichts mehr, sobald ich "overflow: hidden" in das div-Elementschreibe.
  Mit Zitat antworten Zitat
Benutzerbild von s.h.a.r.k
s.h.a.r.k

Registriert seit: 26. Mai 2004
3.159 Beiträge
 
#4

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 13:28
Gin mir einen Moment, muss nach meiner Lösung suchen

Habe folgendes gerade im FF, Chrome und Opera getestet:
Code:
<div style="width: 900px; position: relative; margin: auto; background-color: #f00;height: 20px;">
    <div style="width: 1px; position: absolute; left: 0; top: 0; background-color:#ff0;height: 20px;">
        <span style="position: absolute; width: 200px; left: -150px; z-index: 3; background-color: #0ff;">Test</span>
    </div>
</div>
Das overflow:hidden war das Problem. Jedenfalls passiert es nun, dass erst dann Scrollbalken erscheinen, wenn auch wirklich nur das äußere div betroffen ist. Das span-Element wird ignoriert.
»Remember, the future maintainer is the person you should be writing code for, not the compiler.« (Nick Hodges)
  Mit Zitat antworten Zitat
Benutzerbild von Matze
Matze
(Co-Admin)

Registriert seit: 7. Jul 2003
Ort: Schwabenländle
14.929 Beiträge
 
Turbo Delphi für Win32
 
#5

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 13:44
Wenn ich versuche, das ganze links und rechts zu machen, funktioniert es jedoch nicht mehr und genau den Fall habe ich:

Code:
<div style="width: 900px; position: relative; margin: auto; background-color: #f00;height: 20px;">
    <div style="width: 1px; position: absolute; left: 0; top: 0; background-color:#ff0;height: 20px;">
        <span style="position: absolute; width: 200px; left: -150px; z-index: 3; background-color: #0ff;">Test</span>
    </div>
   
    <div style="width: 1px; position: absolute; right: 0; top: 0; background-color:#ff0;height: 20px;">
        <span style="position: absolute; width: 200px; right: -150px; z-index: 3; background-color: #0ff;">Test</span>
    </div>
</div>
Könntest du da bitte nochmals drüber gucken?
  Mit Zitat antworten Zitat
Benutzerbild von s.h.a.r.k
s.h.a.r.k

Registriert seit: 26. Mai 2004
3.159 Beiträge
 
#6

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 13:51
Ich werde schauen, was ich tun kann, denn das hatte ich noch nicht

[edit] ich muss mich für den Moment geschlagen geben, da mir nichts mehr einfällt, was ich probieren könnte. Es erscheint einfach immer eine Scrollbar.
»Remember, the future maintainer is the person you should be writing code for, not the compiler.« (Nick Hodges)
  Mit Zitat antworten Zitat
Benutzerbild von Matze
Matze
(Co-Admin)

Registriert seit: 7. Jul 2003
Ort: Schwabenländle
14.929 Beiträge
 
Turbo Delphi für Win32
 
#7

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 14:46
Schade. Dennoch vielen Dank.
  Mit Zitat antworten Zitat
Benutzerbild von s.h.a.r.k
s.h.a.r.k

Registriert seit: 26. Mai 2004
3.159 Beiträge
 
#8

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 14:55
Wozu genau brauchst du das denn? Habe auf deiner Website die Palme gesehen, aber wüsste ich keinen Anwendungsfall, außer man nimmt ein Bild. Und das kann man dann wiederrum als Hintergrundbild irgendwie platzieren.
»Remember, the future maintainer is the person you should be writing code for, not the compiler.« (Nick Hodges)
  Mit Zitat antworten Zitat
Benutzerbild von Matze
Matze
(Co-Admin)

Registriert seit: 7. Jul 2003
Ort: Schwabenländle
14.929 Beiträge
 
Turbo Delphi für Win32
 
#9

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 14:58
Jo genau die Palmen sind es (Header + Footer).
  Mit Zitat antworten Zitat
Benutzerbild von s.h.a.r.k
s.h.a.r.k

Registriert seit: 26. Mai 2004
3.159 Beiträge
 
#10

Re: [HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalke

  Alt 9. Mär 2010, 15:02
Hätte da glaub schon eine andere Idee einen Moment bitte... gleich wieder da

[edit] selbst wenn man einiges mit margin spielt bekomme das nicht hin. hier aber meine idee:
Code:
<div style="position: absolute; left: 50%; top: 0; width: 50%;height: 100px; border: 1px solid #f00; border-right: 0; border-left: 0; z-index: 3; overflow:hidden;">
    <div style="position: absolute; left: 400px; top: 0px; width: 100px; height: 100px; background-color: #0ff;"></div>
</div>
Das Problem dabe ist, dass man nicht durch das Div klicken kann, was echt bescheiden ist

Eine ganz andere Idee wäre es, ein Hintergrundbild dafür einzusetzen und das auf den body zu klatschen. Dann hast du auch keinerlei Problem damit. Allerdings kannst du dann keine Überlagerungen machen, wie du das bisher hast.
»Remember, the future maintainer is the person you should be writing code for, not the compiler.« (Nick Hodges)
  Mit Zitat antworten Zitat
Antwort Antwort
Seite 1 von 3  1 23   

Themen-Optionen Thema durchsuchen
Thema durchsuchen:

Erweiterte Suche
Ansicht

Forumregeln

Es ist dir nicht erlaubt, neue Themen zu verfassen.
Es ist dir nicht erlaubt, auf Beiträge zu antworten.
Es ist dir nicht erlaubt, Anhänge hochzuladen.
Es ist dir nicht erlaubt, deine Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus

Gehe zu:

Impressum · AGB · Datenschutz · Nach oben
Alle Zeitangaben in WEZ +1. Es ist jetzt 10:50 Uhr.
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
LinkBacks Enabled by vBSEO © 2011, Crawlability, Inc.
Delphi-PRAXiS (c) 2002 - 2023 by Daniel R. Wolf, 2024 by Thomas Breitkreuz