mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 15:20 Benutzername: Passwort: Auto-Login

Thema: div zentriert funktioniert, nur die darin liegenden nicht! vom 24.07.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> div zentriert funktioniert, nur die darin liegenden nicht!
Seite: 1, 2  Weiter
Autor Nachricht
lillygirl
Threadersteller

Dabei seit: 24.07.2008
Ort: -
Alter: 43
Geschlecht: Weiblich
Verfasst Do 24.07.2008 22:30
Titel

div zentriert funktioniert, nur die darin liegenden nicht!

Antworten mit Zitat Zum Seitenanfang

guten tag,
bin jetzt echt am ende...ich hoffe bekomme hier paar tips oder DIE hilfe....

für meine website habe ich ein div, in dem div ein bild, sozusagen für den hintergrund, der dann später auch auf jeder seite wiederkehren soll. glücklicherweise habe ich es geschafft, diesen div und somit das beinhaltete bild, zentriert auzurichten mit folgenden eingaben:

div.bgscroll {
width:960px;
position:absolute;
left:50%;
top:50%;
margin-left:-480px;
margin-top:-240px;
height:540px;
text-algin:center;


<div class="bgscroll">
<img src="pic/_whiteweb.jpg" /></div>


nun möchte ich auf dem 'hintergrund-div' weitere div's positionieren (z.B. für buttons) welchen css angaben benötige ich dafür, dass diese fest und immer auf der selben position auf dem 'hintergrund-div' bleiben, auch wenn ich das browserfenster kleiner ziehe/minimiere, oder halt für andere bildschirmgrössen....

bisher verändert sich jedes mal die position wenn ich dies tue, aber die buttons müssen doch an ihrem platz bleiben.....mh

danke im vorraus, wäre echt sauglücklich für ne einfache lösung dafür

gruß lillygirl
  View user's profile Private Nachricht senden
Snifferdog

Dabei seit: 08.03.2007
Ort: Düsseldorf
Alter: 35
Geschlecht: Männlich
Verfasst Fr 25.07.2008 08:28
Titel

Antworten mit Zitat Zum Seitenanfang

Hi,

ehm ich glaub ich hab noch nicht ganz verstanden wo das Problem liegt.
Du möchtest, dass dieses Hintergrund-Div und das Bild darin immer Zentriert im Fenster angezeigt wird aber die Buttons oder sonst was die auch in dem Hintergrund-Div liegen sich nicht bewegen?
Das würde dann aber bedeuten, dass beim Verkleinern es passieren kann, dass ein Button hinterher außerhalb dieses Divs liegt ?!
Wenn du das suchst dann musst du eigentlich nur mit position: absolute eine den Elementen eine feste Position zuweisen und natürlich keine Prozent-Werte. Dann bewegt sich da gar nix *zwinker*


Gruß
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
l3mon

Dabei seit: 26.07.2005
Ort: -5m
Alter: 58
Geschlecht: Männlich
Verfasst Fr 25.07.2008 08:46
Titel

Antworten mit Zitat Zum Seitenanfang

stervehe ich dich richtig, du willst deine site immer im viewport zentrieren? schau dir mal die site an klick mich
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Fr 25.07.2008 09:02
Titel

Re: div zentriert funktioniert, nur die darin liegenden nich

Antworten mit Zitat Zum Seitenanfang

Als erstes mal solltest du die Grafik als Hintegrundgrafik definieren.

Code:
div.bgscroll {
        background: transparent url(pic/_whiteweb.jpg) no-repeat;
}
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
lillygirl
Threadersteller

Dabei seit: 24.07.2008
Ort: -
Alter: 43
Geschlecht: Weiblich
Verfasst Fr 25.07.2008 10:16
Titel

Antworten mit Zitat Zum Seitenanfang

hallo und vielen dank erstmal für die antworten!!!

@ Snifferdog
ja das ist richtig, der div mit dem bild (960 x 540) drin soll bei jeder monitorgrösse zentriert angezeigt werden, also ich habe leider nur einen kleinen monitor 15 zoll, aber auch bei den grösseren soll das div in der horizontalen mitte liegen und dann hätte ich mir noch gewünscht, dass es auf jedem monitor (unabhängig der grösse) ein kleines stück über dem unteren rand endet. also in augenhöhe für bessere anschauung...

und die button div's zum beispiel, sollen auch immer ihre position bleiben, egal welche grösse, ich habe zur zeit das problem, wenn ich das fenster minimiere, hängen die buttons an einer völlig anderen stelle, also die sind fest und nur der hintergrund bewegt sich....also schwirig zu erklären, aber die button sollen schon dan ihre position im hintergrund div beibehalten egal was ich mache....versteht mich jemand???



den klick mich link habe ich auch schon vom vielen stöbern gefunden, dankeschön!
  View user's profile Private Nachricht senden
ZeroFlash

Dabei seit: 11.02.2005
Ort: -
Alter: 41
Geschlecht: Männlich
Verfasst Fr 25.07.2008 10:48
Titel

Antworten mit Zitat Zum Seitenanfang

verkleiner mal dein browserfenster... 50% 50% und negative margins bringen den effekt, dass deine site aus dem viewport rausrutscht

probier mal das:

css:
Code:

html,body {
height:100%
}
#spacer {
width:1px;
height:50%
positon:relative;
float:left;
margin-top:-300px; /*halbe containerhöhe*/
}
#container {
width:500px;
height:600px;
margin:0 auto;
clear:left;
}


html:
Code:

<html>
<body>
<div id="spacer"></div>
<div id="container">inhalt...</div>
</body>
</html>
  View user's profile Private Nachricht senden
lillygirl
Threadersteller

Dabei seit: 24.07.2008
Ort: -
Alter: 43
Geschlecht: Weiblich
Verfasst Fr 25.07.2008 11:04
Titel

Antworten mit Zitat Zum Seitenanfang

ich teste es mal, auch wenn ich gerade darüner keinen überblick mehr habe....ich glaube solangsam zerstöre ich alles.....rückmeldung kommt....danke!!!!!
  View user's profile Private Nachricht senden
lillygirl
Threadersteller

Dabei seit: 24.07.2008
Ort: -
Alter: 43
Geschlecht: Weiblich
Verfasst Fr 25.07.2008 11:32
Titel

Antworten mit Zitat Zum Seitenanfang

es funktioniert trotzdem nicht. was muss ich denn den div's für die buttons zum beispiel, ein css zuweisen, damit sie auf ein und der selben stelle im hintergrundbild bleiben. ich habe jetzt folgende werte dafür:

zum beispiel startbutton:

#start {
position:absolute;
top:80px;
z-index:4;
margin-left: auto;
margin-right: auto;
}
  View user's profile Private Nachricht senden
 
Ähnliche Themen Indesign: zentriert großziehen mit ALT funktioniert nicht
Abipage, Umsetzung von schräg liegenden Links (Bilder)
PDF-Datei mit Links zu relativ liegenden Video-Dateien
Div-Container mit Php-Seiten darin..HILFE!
Altes (Fl5) swf-File - Bilder darin austauschen?
iframe-Größe dem darin geladenen Inhalt anpassen
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
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.