<b>REGISTER</b>

GFX-Sector - Fragen & Probleme


 
GFX-Sector » GFX-Area » Fragen & Probleme » [Problem] Websitze komplett zentrieren » Hello Guest [Login|Register]
Last Post | First Unread Post Print Page | Recommend to a Friend | Add Thread to Favorites

Fragen & Probleme

Hier können Fragen rund um das Thema GFX und Photoshop gestellt werden. Probleme und Anfängerfragen sind hier auch willkommen.
Pages (2): [1] 2 next » Post New Thread Post Reply

Websitze komplett zentrieren

     Deutsche Version  English version
Author
Post « Previous Thread | Next Thread »

Rusquad
Zauberstabbenutzer


Avatar von Rusquad

Registration Date: 05.06.2009
Posts: 21
Location: Kasachstan
Program: Photoshop CS5, Paint.net, TopStyle Pro 2.5

Spacer
Websitze komplett zentrieren

Websitze komplett zentrieren

      

Hallo an Alle,

ich weiß leider nicht wohin mit diesem Thread deswegen bitte nicht aufregen Leute und einfach verschieben/closen wenn das ganze hier falsch ist. smile

Ich habe vor einem Monat mit dem HTML/CSS lernen angefangen und habe auch schon ein paar kleine Grundkenntnisse in PHP/Mysql, meine Schwester die eine Ballettschule in Frankfurt aufmachen möchte hat mich gebeten ihr eine Website zu erstellen. Gesagt getan ich habe ihr eine (NACH IHREN WÜNSCHEN) Website gecodet und nun steht sie fertig da. Das Problem, wenn man diese in anderen Bildschirmauflösungen besucht werden manche Teile total verschoben dargestellt. Nun sitze ich schon 3 Tage dran und weiß einfach nicht woran es liegt habe schon sooo viel versucht und wollte mich jetzt mal an euch Spezialisten melden ^^ ich hoffe doch ihr könnt mir weiterhelfen und mir zeigen wie ich das ganze zentriert anzeigen lassen kann. Achja das ganze wurde auf einer Bildschirmauflösung von 1280x800 Pixeln gemacht.

die Adresse: www.ballett-schule-frankfurt.de

der HTML Quelltext:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>ballett-schule-frankfurt</title>
<link href="Unbenannt-2.css" type="text/css" rel="stylesheet">
</head>
<body id="body">


<div div id="header"><img src="Untitled-4.jpg"></div>
<div id="menuposition"><div id="menu">
<a href="index.html">Home</a>
<a href="biographie.html">Biographie</a>
<a href="galerie.html">Galerie</a>
<a href="kurse.html">Kurse</a>
<a href="buehne.html">Bühne</a>
<a href="links.html">Links</a>
<a href="newsletter.html">Newsletter</a>
<a href="kontakt.html">Kontakt</a>
<a href="impressum.html">Impressum</a>
</div></div>
<div id="home2girls"></div>

<div id="container">

In meiner Ballettschule wird der russisch-akademische Stil des Balletts nach der Methode von A.J. Waganowa unterrichtet.
Der kindgerecht aufgebaute Unterricht in den Kinderklassen soll dem Zweck dienen Kreativität bei Kindern schon
ab drei Jahren zu fördern um zur entwicklung selbstständiger Künstlerpersönlichkeiten beizutragen.

<p>
In den Ausbildungsklassen findet ein intensivierter Unterricht statt. Die Schüler werden gefördert ihre Individualität
auszuprägen und dabei zielstrebig zu sein. Außerdem trägt der Ballettunterricht dazu bei Haltungsschäden vorzubeugen,
trainiert Beweglichkeit und steigert die Musikalität.
</p>
<p align="left">Oksana Hoffmann</p>
</div>

<hr id="linie" width="450px" color="#FFFFFF">
<p id="textstil">2011 © Oksana Hoffmann | designed by Emil Hoffmann</p>

</div>

</body>
</html>



und CSS Quelltext:


#menu a:hover {
border-right:5px solid #FFCCFF;
}
#menu a:active {
border-right:5px solid #FFCCFF;
}
#menuposition {
position:absolute;
right:25%;
top:20%;
}


#container {
width: 600px;
height: 430px;
color:#000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
position: absolute;
top:21%;
right:35%;
background-attachment:fixed;
}

#linie {
position:absolute;
top:95%;
right:40%;
}

#textstil {
text-transform:uppercase;
letter-spacing:2px;
text-align: center;
font-size:9px;
position:absolute;
top:96%;
right:42%;
}

#home2girls {
position:absolute;
top:20%;
right:10%;
height:321px;
width:467px;
background-image:url(home-2girls.png);
}


Ich hoffe doch einer von euch kann mir helfen und wie gesagt falls das ganze hier nicht reinpasst bitte verschieben oder closen, danke.

Lg
Websitze komplett zentrieren 10.04.2011 00:06 Rusquad is offline Search for Posts by Rusquad

Taddy Taddy is a male
Zauberstabbenutzer


Avatar von Taddy

Registration Date: 18.03.2011
Posts: 23
Program: PS 5

Spacer
      

vorm body <center> und hinter </body></center> und es sollte zentriert sein. Das es sich verschiebt kann daran liegen das du bei den tabellen den leerzeichen platzhalter drinnnen hast der z.B automatisch mit erstellt wird wenn du dreamwaver als unterstützung benutzt.

Websitze komplett zentrieren 10.04.2011 00:33 Taddy is offline Search for Posts by Taddy

Rusquad
Zauberstabbenutzer


Avatar von Rusquad

Registration Date: 05.06.2009
Posts: 21
Location: Kasachstan
Program: Photoshop CS5, Paint.net, TopStyle Pro 2.5

Thread Starter Thread Started by Rusquad
Spacer
      

quote:
Original von Taddy
vorm body <center> und hinter </body></center> und es sollte zentriert sein. Das es sich verschiebt kann daran liegen das du bei den tabellen den leerzeichen platzhalter drinnnen hast der z.B automatisch mit erstellt wird wenn du dreamwaver als unterstützung benutzt.


Erstmal danke für deine Antwort! Ich habe das mit <center></center> versucht leider wird der Inhalt weiterhin falsch angezeigt. Bei einer Auflösung von 1920x1080 z.B. sieht das ganze so aus:klick

This post has been edited 1 time(s), it was last edited by Rusquad: 10.04.2011 00:44.

Websitze komplett zentrieren 10.04.2011 00:44 Rusquad is offline Search for Posts by Rusquad

Taddy Taddy is a male
Zauberstabbenutzer


Avatar von Taddy

Registration Date: 18.03.2011
Posts: 23
Program: PS 5

Spacer
      

ehm das liegt dann auf jeden fall an deinem header und da iwo am code, nimm mal aus spaß den header raus und schau, ob dann alles richtig gesetzt ist. Wenn nicht fällt das schon mal weg.

edit:

<div div id="header"><img src="Untitled-4.jpg"></div>
<div id="menuposition"><div id="menu">
<a href="index.html">Home</a>



das div div schreib da nur ein div hin

This post has been edited 2 time(s), it was last edited by Taddy: 10.04.2011 00:49.

Websitze komplett zentrieren 10.04.2011 00:47 Taddy is offline Search for Posts by Taddy

Rusquad
Zauberstabbenutzer


Avatar von Rusquad

Registration Date: 05.06.2009
Posts: 21
Location: Kasachstan
Program: Photoshop CS5, Paint.net, TopStyle Pro 2.5

Thread Starter Thread Started by Rusquad
Spacer
      

Ist jetzt so das der Header verschwunden ist aber das ganze bleibt in der Auflösung 1920 x 1080 trotzdem rechts oben im Eck wie im Bild. Habe auch das unnötige "div" entfernt.

Websitze komplett zentrieren 10.04.2011 00:56 Rusquad is offline Search for Posts by Rusquad

Taddy Taddy is a male
Zauberstabbenutzer


Avatar von Taddy

Registration Date: 18.03.2011
Posts: 23
Program: PS 5

Spacer
      

ehm dann weiß ich auch grad nicht bin aber auch schon im halbschlaaf und werd jezt aucht mal schlaafen gehen. Wenn du es bis morgen nicht hinbekommen hast schau ichs mir noch mal an. gn8

Websitze komplett zentrieren 10.04.2011 00:58 Taddy is offline Search for Posts by Taddy

Rusquad
Zauberstabbenutzer


Avatar von Rusquad

Registration Date: 05.06.2009
Posts: 21
Location: Kasachstan
Program: Photoshop CS5, Paint.net, TopStyle Pro 2.5

Thread Starter Thread Started by Rusquad
Spacer
      

Alles klar, danke trotzdem für deine Hilfe ich versuchs mal weiter und google weiter nach anderen Möglichkeiten.

Websitze komplett zentrieren 10.04.2011 01:00 Rusquad is offline Search for Posts by Rusquad

Nicotsche Nicotsche is a male
Fingerwischer


Avatar von Nicotsche

Registration Date: 15.07.2009
Posts: 27
Location: Deutschland - Insel Rügen
Program: Photoshop cs4 - cs5

Spacer

RE: Websitze komplett zentrieren

      

mach am anfang in der stylesheet datei * {margin: 0px 0px; padding: 0px 0px;}

denn lass das absolute weg, mach bei menü zb. einfach nur margin-left: 100px; (kommt drauf an wie weit du es von links abestehen haben möchtest)
zb machst du #header {background: url(bildurl) top center no-repeat; width: angabe; height: angabe; margin: 0px auto;} schon sollte der header in der mitte sein, egal in welcher auflösung.. so machst das halt auch beim rest



Websitze komplett zentrieren 10.04.2011 01:05 Nicotsche is offline Homepage of Nicotsche Search for Posts by Nicotsche

Rusquad
Zauberstabbenutzer


Avatar von Rusquad

Registration Date: 05.06.2009
Posts: 21
Location: Kasachstan
Program: Photoshop CS5, Paint.net, TopStyle Pro 2.5

Thread Starter Thread Started by Rusquad
Spacer
      

@Nicotsche:

Danke der Header ist nun zentriert allerdings wird das ganze in der Auflösung 1920x1080 weiterhin rechts auf dem Monitor angezeigt.

bild: klick

Websitze komplett zentrieren 10.04.2011 01:31 Rusquad is offline Search for Posts by Rusquad

canon211
Filtertester


canon211 hat kein Avatar

Registration Date: 28.05.2009
Posts: 8

Spacer
      

Ich will nur kurz darauf hinweisen, dass es ja eine repräsentierende Seite sein soll:
Wenn ich das Deutsch hier lese, würde ich mir denken, dass dort keine Uni Einfluss auf die Person gehabt hat :x Kommasetzung und so Wink



This post has been edited 1 time(s), it was last edited by canon211: 10.04.2011 01:40.

Websitze komplett zentrieren 10.04.2011 01:39 canon211 is offline Search for Posts by canon211

Nicotsche Nicotsche is a male
Fingerwischer


Avatar von Nicotsche

Registration Date: 15.07.2009
Posts: 27
Location: Deutschland - Insel Rügen
Program: Photoshop cs4 - cs5

Spacer
      

Was genau hast jetzt im html und css quelltext stehen?



Websitze komplett zentrieren 10.04.2011 01:49 Nicotsche is offline Homepage of Nicotsche Search for Posts by Nicotsche

Rusquad
Zauberstabbenutzer


Avatar von Rusquad

Registration Date: 05.06.2009
Posts: 21
Location: Kasachstan
Program: Photoshop CS5, Paint.net, TopStyle Pro 2.5

Thread Starter Thread Started by Rusquad
Spacer
      

quote:
Original von canon211
Ich will nur kurz darauf hinweisen, dass es ja eine repräsentierende Seite sein soll:
Wenn ich das Deutsch hier lese, würde ich mir denken, dass dort keine Uni Einfluss auf die Person gehabt hat :x Kommasetzung und so Wink


Das ganze wird noch überarbeitet, es sind ja nicht mal alle Seiten fertig und die Homepage wurde nicht mal in Suchmaschinen eingetragen (wird sie auch noch nicht solange sie nicht fertig ist). Aber nett das du mir helfen willst. smile


der aktuelle HTML Quelltext:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>ballett-schule-frankfurt</title>
<link href="Unbenannt-2.css" type="text/css" rel="stylesheet">
</head>
<center>
<body id="body">
<div id="mitte">
<table border="0" align="center" width="100%" height="100%" bgcolor="#cEcEcE" cellspacing="1" cellpadding="5" bordercolor="white">
<tr>

<td>
<div id="header"><img src="Untitled-4.jpg"></div>
<div id="menuposition"><div id="menu">
<a href="index.html">Home</a>
<a href="biographie.html">Biographie</a>
<a href="galerie.html">Galerie</a>
<a href="kurse.html">Kurse</a>
<a href="buehne.html">Bühne</a>
<a href="links.html">Links</a>
<a href="newsletter.html">Newsletter</a>
<a href="kontakt.html">Kontakt</a>
<a href="impressum.html">Impressum</a>
</div></div>
<div id="home2girls"></div>

<div id="container">

In meiner Ballettschule wird der russisch-akademische Stil des Balletts nach der Methode von A.J. Waganowa unterrichtet.
Der kindgerecht aufgebaute Unterricht in den Kinderklassen soll dem Zweck dienen Kreativität bei Kindern schon
ab drei Jahren zu fördern um zur entwicklung selbstständiger Künstlerpersönlichkeiten beizutragen.

<p>
In den Ausbildungsklassen findet ein intensivierter Unterricht statt. Die Schüler werden gefördert ihre Individualität
auszuprägen und dabei zielstrebig zu sein. Außerdem trägt der Ballettunterricht dazu bei Haltungsschäden vorzubeugen,
trainiert Beweglichkeit und steigert die Musikalität.
</p>
<p align="left">Oksana Hoffmann</p>
</div>

<hr id="linie" width="450px" color="#FFFFFF">
<p id="textstil">2011 © Oksana Hoffmann | designed by Emil Hoffmann</p>

</td>

</tr>
</table>
</div>


</body>
</center>
</html>




CSS Quelltext:


@charset "utf-8";
/* CSS Document */

#body {
background-color:#cEcEcE;
}




#header {
background:url(home-2girls.png);
top:center;
repeat:no-repeat;
width:500px;
height:100px;
margin: 0px auto;
}


#menu a, #menu a:visited {
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
text-decoration:none;
text-align:left;
background-color:#999;
color:#fff;
display:block;
width:8em;
padding:0.2em;
margin:1em auto;
border-right:5px solid #fff;
margin-right:89%;
}
#menu a:hover {
border-right:5px solid #FFCCFF;
}
#menu a:active {
border-right:5px solid #FFCCFF;
}
#menuposition {
position:absolute;
right:275px;
top:150px;
}


#container {
width: 600px;
height: 430px;
color:#000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
position: absolute;
top:160px;
right:450px;
background-attachment:fixed;
margin-left:50px;
}

#linie {
position:absolute;
top:605px;
right:525px;
}

#textstil {
text-transform:uppercase;
letter-spacing:2px;
text-align: center;
font-size:9px;
position:absolute;
top:610px;
right:565px;
}

#home2girls {
position:absolute;
top:150px;
right:25px;
height:321px;
width:467px;
background-image:url(home-2girls.png);
}

#mitte {
margin-left: 21%;
margin-right: auto;
}

Websitze komplett zentrieren 10.04.2011 01:55 Rusquad is offline Search for Posts by Rusquad

Nicotsche Nicotsche is a male
Fingerwischer


Avatar von Nicotsche

Registration Date: 15.07.2009
Posts: 27
Location: Deutschland - Insel Rügen
Program: Photoshop cs4 - cs5

Spacer
      

versuch das mal

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>ballett-schule-frankfurt</title>
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
<div id="header"> </div>
<div id="menu">
<ul>
<li><a href="#"> Was auch immer</a></li>
<li><a href="#"> Was auch immer</a></li>
</ul>
</div>
<div id="home2girls"></div>
<div id="container"> In meiner Ballettschule wird der russisch-akademische Stil des Balletts nach der Methode von A.J. Waganowa unterrichtet. Der kindgerecht aufgebaute Unterricht in den Kinderklassen soll dem Zweck dienen Kreativität bei Kindern schon ab drei Jahren zu fördern um zur entwicklung selbstständiger Künstlerpersönlichkeiten beizutragen. <p> In den Ausbildungsklassen findet ein intensivierter Unterricht statt. Die Schüler werden gefördert ihre Individualität auszuprägen und dabei zielstrebig zu sein. Außerdem trägt der Ballettunterricht dazu bei Haltungsschäden vorzubeugen, trainiert Beweglichkeit und steigert die Musikalität. </p>
<p align="left">Oksana Hoffmann</p> </div>
<hr id="linie" width="450px" color="#FFFFFF">
<p id="textstil">2011 © Oksana Hoffmann | designed by Emil Hoffmann</p> </div>
</body>
</html>


CSS

* {margin: 0px 0px; padding: 0px 0px;}
body {
background-color:#cEcEcE;
}




#header {
background: url(home-2girls.png) top center no-repeat;
width:500px;
height:100px;
margin: 0px auto;
}

#menu {margin: 0px auto;}
#menu ul {margin: 60px auto; list-style: none;}
#menu li {margin: 10px 10px;}
#menu a, #menu a:visited {
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
text-decoration:none;
text-align:left;
background-color:#999;
color:#fff;
display:block;
width:8em;
padding:0.2em;
margin:1em auto;
border-right:5px solid #fff;
margin-right:89%;
}
#menu a:hover {
border-right:5px solid #FFCCFF;
}
#menu a:active {
border-right:5px solid #FFCCFF;
}


#container {
width: 600px;
height: 430px;
color:#000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
position: absolute;
top:160px;
right:450px;
background-attachment:fixed;
margin-left:50px;
}

#linie {
position:absolute;
top:605px;
right:525px;
}

#textstil {
text-transform:uppercase;
letter-spacing:2px;
text-align: center;
font-size:9px;
position:absolute;
top:610px;
right:565px;
}

#home2girls {background: url(home-2girls.png) center right no-repeat;
height:321px;
width:467px;
}



Websitze komplett zentrieren 10.04.2011 02:14 Nicotsche is offline Homepage of Nicotsche Search for Posts by Nicotsche

Rusquad
Zauberstabbenutzer


Avatar von Rusquad

Registration Date: 05.06.2009
Posts: 21
Location: Kasachstan
Program: Photoshop CS5, Paint.net, TopStyle Pro 2.5

Thread Starter Thread Started by Rusquad
Spacer
      

hmm das ganze schaut nun so aus:

bild

edit: Also der header ist aufjedenfall in der mitte smile

deswegen danke schonmal an alle die mir versuchen zu helfen! Allerdings wird der Rest leider verschoben...

This post has been edited 1 time(s), it was last edited by Rusquad: 10.04.2011 02:35.

Websitze komplett zentrieren 10.04.2011 02:33 Rusquad is offline Search for Posts by Rusquad

Nicotsche Nicotsche is a male
Fingerwischer


Avatar von Nicotsche

Registration Date: 15.07.2009
Posts: 27
Location: Deutschland - Insel Rügen
Program: Photoshop cs4 - cs5

Spacer
      

quote:
Original von Rusquad
hmm das ganze schaut nun so aus:

bild

edit: Also der header ist aufjedenfall in der mitte smile

deswegen danke schonmal an alle die mir versuchen zu helfen! Allerdings wird der Rest leider verschoben...


liegt am container, daran hab ich nix gemacht, änder es wie bei den andern, denn klapts, lass das position: absolute; weg und mach wie bei den anderen margin: 0px auto;

ich dachte das ich dir 'n kleinen tipp mit den anderen gegeben habe :p



Websitze komplett zentrieren 10.04.2011 02:53 Nicotsche is offline Homepage of Nicotsche Search for Posts by Nicotsche
 
Spacer
   
GFX-Sector
unregistered


 hat kein Avatar


Spacer

Have you enjoyed this topic?


If you were enjoying this post and if you keen on reading more interesting stuff then do not hesitate to complete the free sign up.

After the free registration you will gain access to all areas and you will be able to communicate with other artists from all over the world.

In addition you will benefit from our Photoshop and coding section as well as from our huge (hundreds of gigabytes) free resource section where you can find everything you will need to be a successful (web) designer/artist.

Sign up now and enjoy the advantages as a registered member.

(This website will be ad-free after a complete free sign up.)

New Post 11.04.2011 15:13  
Pages (2): [1] 2 next » Tree Structure | Board Structure
Post New Thread Post Reply
GFX-Sector » GFX-Area » Fragen & Probleme » [Problem] Websitze komplett zentrieren

Similar topics to Websitze komplett zentrieren
Thread
Gift fürs Komplette Team und Fireball und für ZabZ und Eldrazi (Forum: Gifts)
komplette homepage/website (Forum: Archiv für Anfragen)
[HTML/CSS] [HTML]Kompletten Code einer Website(Tutorial) gesucht!!!!! (Forum: HTML & CSS Tutorials)
[Suche]Komplettes Bannerset für mein Projekt (Forum: Archiv)
[Frage] Anfänger. Bild - Mich herausschneiden... ( Hintergrund muss komplett weg bzw. weiß sein... ) (Forum: Fragen & Probleme)