zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Element ausserhalb seite positionieren, so daß keine scrollbar entsteht

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 18.07.2009, 09:48
Benutzerbild von st-SaHiB
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 18.07.2009
Beiträge: 4
st-SaHiB befindet sich auf einem aufstrebenden Ast
Standard Element ausserhalb seite positionieren, so daß keine scrollbar entsteht

Hallo zusammen,

habe hier ein kleines Prolem, an dem ich mir irgendwie die Zähne ausbeise.

Habe eine zentrierte Seite mit fixer breite.
HTML-Code:
#seite{
    width:990px;
    margin:0 auto;
}
Rechts von der Seite möchte ich eine Grafik ausgeben.
Dazu stecke ich das Bild in den div #seite, lasse ihn dann nach rechts fließen und verschiebe das Bild dann um seine eigene breite nach rechts. Somit schließt es rechtsbündig an die Seite an.

HTML-Code:
    #bild rechts{
        float:right;
        position:relative;
        left:55px;
    }
jetzt stellt sich nur folgendes Problem: Skaliere ich das Browserfenster kleiner als 1045px (990+55px) Breite, wird ein horizontaler Scrollbalken eingeblendet.
Mache ich das ganze analog auf der linken Seite, schiebt es die Grafil links aus dem sichtbaren Bereich raus und die Scroll-leiste kommt erst wie gewünscht bei < 990px.

Frage: wie kann ich diesen Effekt auch auf der rechten Seite hinbekommen?
Das ganze als Hintergrundgrafik einzubinden geht leider nicht sinnvoll wegen dem background-alignment-bug (zentrierter Hintergrund wird bei ungeraden Fensterbreiten um 1px gegenüber zentrierten elementen verschoben) und weil das obige Beispiel eben nur ein Beispiel ist, die echte Seitenstruktur is da deutlich komplexer.

Mit absoluter positionierung hab ich es auch schon probiert - gleicher effekt. Auch mit negativen margins. Overflow wäre eine Lösung, allergings fällt mir da keine HTML-Struktur ein, in der der #seite Div, dann trotzdem einen scrollbalken produziert...

bin für jede Anregung dankbar
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 18.07.2009, 22:04
Benutzerbild von paracelsus
be simple
XHTMLforum-Kenner
 
Registriert seit: 16.07.2007
Ort: Kapfenberg - Austria, einige meinen am "Anus Mundi"
Beiträge: 4.788
paracelsus ist einfach richtig nettparacelsus ist einfach richtig nettparacelsus ist einfach richtig nettparacelsus ist einfach richtig nett
Standard

Hat Du schon mal
Code:
html {overflow-x : hidden;}
probiert?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 19.07.2009, 09:24
Benutzerbild von st-SaHiB
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 18.07.2009
Beiträge: 4
st-SaHiB befindet sich auf einem aufstrebenden Ast
Standard

ne, das bringt nichts - das würde die horizontale scrollbar ja komplett deaktivieren, dh ich hätte auch keine scrollbar, wenn das fenster kleiner als 990px (seitenbreite) ist - die seite an sich soll ja aber noch scrollbar sein, nur eben das element das ich rechts ausserhalb der seite positionieren möchte, soll keine scrollbar erzeugen.

schiebe ich ein element irgendwo zB 10000px (übertrieben!!!) nach links (oder nach oben), verschwindet es einfach ausserhalb der seite. schiebe ich es 10000px nach rechts (oder nach unten), bekomme ich eine scrollbar die bis zu dem element scrollt - und genau die möchte ich nicht
ich hasse css ^^
Mit Zitat antworten
  #4 (permalink)  
Alt 19.07.2009, 14:35
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.854
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Das Problem ist nicht CSS, sondern wie die Browser damit umgehen. Ich habe auf die Schnelle eine Lösung gefunden, die in IE 8, FX 3.5 und Safari funktioniert, aber z.B. IE < 7 und Opera zeigen dennoch einen horiz. Scrollbalken.

Die erwähnte 1px-Verschiebung ist oft ein Problem, aber meist lässt es sich lösen. Zeige doch mal ein JPG Deines Designs (d.h. wie es werden soll).
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
  #5 (permalink)  
Alt 19.07.2009, 17:28
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.854
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Was überall zu gehen scheint (nur der IE 6 braucht noch einen min-width-Hack):

HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html lang="de" xml:lang="de" xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Test</title>
<style type="text/css">

* {
	margin: 0;
	padding: 0;
	}

html,
body {
	width: 100%;
	min-width: 650px;
	}

body {
	overflow: hidden;
	overflow-y: auto;
	}

#n1 {
	background: red;
	height: 200px;
	width: 600px;
	position: relative;
	margin: 0 auto;
	}

#n2 {
	background: green;
	width: 2000px;
	position: absolute;
	right: 0;
	top: 0;
	}

</style>
</head>

<body>

<div id="n1">text
	<div id="n2">text</div>
</div>

</body>

</html>
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
  #6 (permalink)  
Alt 20.07.2009, 08:49
Benutzerbild von st-SaHiB
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 18.07.2009
Beiträge: 4
st-SaHiB befindet sich auf einem aufstrebenden Ast
Standard

min-width - mensch, warum bin ich nich auf die idee gekommen

funktioniert!

Dank Dir!!!
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre 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


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Inhalt von float: right wird in Firefox unten angerechnet Sukkulent CSS 5 16.09.2005 22:43
csss seite in frame horiz. scrollbar Holger (HMR) CSS 0 15.09.2005 15:05
<div> immer am Ende der Seite positionieren? timo123 CSS 2 15.04.2005 11:04
Layer am "Schluss" der Seite positionieren lavitto CSS 3 13.04.2005 13:47
Leiste am Ende einer Seite positionieren? chris2001 CSS 0 28.12.2004 15:20


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:47 Uhr.