[GastForen Archiv Adobe GoLive Seite im Browser zentrieren

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Archiv - Archivierte Foren
Themen
Beiträge
Moderatoren
Letzter Beitrag

Seite im Browser zentrieren

moki
Beiträge gesamt: 257

8. Nov 2006, 13:56
Beitrag # 1 von 5
Bewertung:
(1114 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo,

ich habe für meine Website folgende Programmierung als Ausgangspunkt genommen. Nun bin ich mit meiner Website schon mitten in der Arbeit, jedoch ist mir nun aufgefallen, dass dieser Code zwar zentriert, jedoch im Zweifelsfalle links oben am Null-Punkt meine Seite auch abschneidet, wenn das Fenster zu klein ist. Ich finde das äußerst ungünstig, weiss nun aber auch nicht, ob man mit diesem Ansatz der Seite noch zuweisen kann, dass Sie am Nullpunkt stoppt.

ich hoffe das ist verständlich
Grüße
Moki




<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>Horizontal und vertikal zentriert</title>
<style type="text/css" media="screen"><!--
body
{
color: white;
background-color: #003;
margin: 0;
overflow: hidden }

#horizon
{
color: white;
background-color: transparent;
text-align: center;
position: absolute;
top: 50%;
left: 0px;
width: 100%;
height: 1px;
overflow: visible;
visibility: visible;
display: block
}

#content
{
font-family: Verdana, Geneva, Arial, sans-serif;
background-color: grey;
margin-left: -300px;
position: absolute;
top: -200px;
left: 50%;
width: 600px;
height: 400px;
visibility: visible
}

.bodytext
{
font-size: 14px
}

.headline
{
font-weight: bold;
font-size: 24px
}

#footer
{
font-size: 11px;
font-family: Verdana, Geneva, Arial, sans-serif;
text-align: center;
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
height: 20px;
visibility: visible;
display: block
}

a:link, a:visited
{
color: #06f;
text-decoration: none
}

a:hover
{
color: red;
text-decoration: none
}
--></style>
</head>

<body>
<div id="horizon">
<div id="content">
<div class="bodytext">
Diese Fl&auml;che ist<br>
<span class="headline">WIRKLICH ZENTRIERT</span>und bleibt auch hier stehen!
<p>Als HTML-Seite, f&uuml;r XHTML unten klicken,</p>
<p>geht nicht mit IE!</p>
</div>

</div>
</div>
<div id="footer">
<a href="rahmencxhtml.html">mit XHTML</a></div>
</body>

</html>
X

Seite im Browser zentrieren

SabineP
Beiträge gesamt: 7586

8. Nov 2006, 15:30
Beitrag # 2 von 5
Beitrag ID: #260756
Bewertung:
(1107 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Moki,

mit einer Tabellenzelle wäre das kein Problem:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title> New Document </title>
<style type="text/css">
body{margin:0px}
.content{background-color:#ff00ff;width:600px;height:400px;}
.tabelle{height:100%;width:100%;text-align:center;}
</style>
</head>
<body>
<table class="tabelle">
<tr><td align="center"><div class="content">Hier ist alles zentriert.</td></tr>
</table>
</body>
</html>

Einen anderen Weg sehe ich momentan auch nicht.
Gruß Sabine


als Antwort auf: [#260720]
(Dieser Beitrag wurde von SabineP am 8. Nov 2006, 15:31 geändert)

Seite im Browser zentrieren

moki
Beiträge gesamt: 257

9. Nov 2006, 14:30
Beitrag # 3 von 5
Beitrag ID: #260991
Bewertung:
(1087 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo nochmal,

nun habe ich die Variante mit der Tabellenzelle ausprobiert. Aber ich stolpere da schon allein über die Positionierung, wenn ich in die Content-Ebene weitere Ebenen lege: Pixelgenau funktioniert nicht und mit "margin" und "padding" funktioniert es auch nicht wirklich. Wo ist da der Kniff?


Grüße
Moki


als Antwort auf: [#260756]

Seite im Browser zentrieren

SabineP
Beiträge gesamt: 7586

9. Nov 2006, 15:32
Beitrag # 4 von 5
Beitrag ID: #261031
Bewertung:
(1079 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Moki,

was funktioniert denn nicht?
Ohne URL zur Seite können wir dazu auch nichts weiter sagen.

Gruß Sabine


als Antwort auf: [#260991]

Seite im Browser zentrieren

moki
Beiträge gesamt: 257

9. Nov 2006, 18:24
Beitrag # 5 von 5
Beitrag ID: #261086
Bewertung:
(1068 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo

habe mittlerweile einen befreundeten Programmierer gelöchert, der sich mit mir hingesetzt hat. UFF – das mit dem zentriert ist ganz schön vertrackt. Aber danke noch mal. Ist per Ferndiagnose wirklich vieleicht ein wenig schwer.


Grüße
Moki


als Antwort auf: [#261031]
X

Aktuell

Web / SEO / Blockchain / Betriebssystem
unsplash_300

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

pdf-icon Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen
02.02.2023

Prozesse optimieren und effizient gestalten

Zürich
Donnerstag, 02. Feb. 2023, 08.00 - 10.00 Uhr

Digitalisierung, Webauftritt

Digitalisierung mitgestalten - Worauf kommt es an? Wie wichtig ist die Webseite? Webseite mit Word Press? Interne Prozesse optimieren

Ja

Organisator: B. Isik - SNF Academy

Kontaktinformation: Birol Isik, E-Mailinfo AT bkcc DOT ch

https://digitalisierung-heute.ch/digitalisierung-informationstag-schweiz/

Veranstaltungen
01.03.2023 - 09.03.2023

Online
Mittwoch, 01. März 2023, 00.00 Uhr - Donnerstag, 09. März 2023, 00.00 Uhr

Online Webinar

Wie gehen wir mit diesen Veränderungen um? Was ist notwendig, damit wir die Digitalisierung im Unternehmen klappt? Veränderungsprozesse verstehen und entsprechend handeln Mitarbeiter als Botschafter Webseite mit WordPress erstellen SEA /SEO (Ads aufschalten)

Ja

Organisator: B. Isik - SNF Academy

Kontaktinformation: B. Isik, E-Mailinfo AT snfa DOT ch

https://www.fernstudiumfitness.ch/digitalisierung-schweiz/