positie homepage

Status
Niet open voor verdere reacties.

sgrav000

Verenigingslid
Lid geworden
8 sep 2000
Berichten
929
Ik heb een kleine compacte homepage gemaakt. Ik heb een monitorscherm van 19 inch. Ik wil nu dat deze kleine homepage in het midden van mijn browserscherm verschijnt. Tot op heden lijnt hij altijd op links uit. Welke html-tag moet ik gebruiken en op welke plaats. Ik heb <center> geprobeerd (met de afsluittag) direct na de <body> openingstag. Ik heb ook <div align="center"> gebruikt in de body openingstag. Het haalt niets uit. Misschien moet er wel iets aan toegevoegd worden in de headsectie. Graag jullie advies. (Als voorbeeld van zo'n compacte gecentreerde homepage noem ik www.planet.nl, maar ik kon in de bron geen aanwijzingen vinden voor die centrale plaats).

Graag jullie advies. B.v.d.

sgrav000
 
Je kan alles in een tabel plaatsen, zodat alles in het midden komt. Zie bijlage.
 

Bijlagen

homepage in het midden

Dank, Caveman, voor jouw oplossing.

Ik heb homepage geplaatst in de tabel. Maar bij het plaatsen van <center> na body en voor <table enz.> krijg ik de medeling dat "center in HTML 4 is deprecated". De homepage verschijnt zonder enige wijziging. Kennelijk wordt er in HTML 4 een andere tag gebruikt. Is dit zo, en, zo ja, hoe luidt die andere tag? Of zit ik met een oude HTML manager (HomeSite 4.5.1) met een verlopen HTML. Ik weet dat er een versie 5 is maar ik kon ook mijn 4 zodanig updaten dat hij up-to-date is. Of is "center" een oude tag? Graag jouw commentaar.


sgrav000
 
Er zijn een paar grote verschillen tussen HTML 3.2 en HTML 4.0, maar het is wat flauw van Homepage hierover te klagen, want 'center' mag dan bij HTML 3.2 horen, HTML 4.0 snapt het ook.

Je kan 'center' vervangen door ' div align="center" ', dat is de juiste syntax.
 
homepage in het midden

Hallo Caveman,


Ik heb <div align="center"> geprobeerd (met de afsluitende tag) maar tekst en objecten langs de rechterrand werden door elkaar weergegeven. De homepage kwam niet van zijn plaats. Bijzonder is wel dat ik <center>.....</center> nogmaals probeerde zonder de foutmelding maar ook zonder enig resultaat: de homepage bleef volledig intakt gewoon op zijn plaats. Voor de gelegenheid had ik bij body ook alle toevoegingen zoals LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 BGCOLOR="#ffffff" LINK="#0000ff" VLINK="#800080" weggelaten. Dus exact zoals de "center_sample[1] vereist. Het leverde niets op. Wat kan ik nog meer doen?

sgrav000
 
zie Teacher

Wat ik je gaf is zoiets als een plank om een gat dicht te timmeren, het werkt niet in alle gevallen, maar ik weet niet van je welke code je al hebt.
 
code

Teacher, helaas heb ik geen ervaring met CSS manipuleren.

Caveman, ik geef je de code tot het begin van de tabel in de oorspronkelijke vorm van toen ik de eerste vraag stelde:

<!DOCTYPE HTML PUBLIC "-//WC3//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<HTML>

<HEAD>
<NOSCRIPT>
<META HTTP-EQUIV="refresh" CONTENT="1; URL=noscript.html">
</NOSCRIPT>
<META NAME="KEYWORDS" CONTENT="">
<META NAME="DESCRIPTION" CONTENT="">
<META NAME="generator" CONTENT="">

<!--

//-->
<TITLE> Mijn Homepage </TITLE>

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
window.onerror = null;
manufacturer = navigator.appName;
versionnum = parseFloat(navigator.appVersion);
if (manufacturer.indexOf('Netscape') >= 0 && versionnum < 4.0)
location.href = 'error.html';
if (manufacturer.indexOf('Microsoft') >= 0 && versionnum < 4.0)
location.href = 'error.html';
//-->
</SCRIPT>

<STYLE TYPE="text/css">
.textstyle0 {font-family:Comic Sans MS;font-weight:bold;font-style:normal;font-size:10pt;text-decoration:normal;color:#400040;}
.textstyle1 {font-family:Comic Sans MS;font-weight:bold;font-style:normal;font-size:10pt;text-decoration:normal;color:#ffffff;}
.textstyle2 {font-family:Comic Sans MS;font-weight:bold;font-style:normal;font-size:14pt;text-decoration:normal;color:#ffffff;}
.textstyle3 {font-family:Arial;font-weight:bold;font-style:normal;font-size:8pt;text-decoration:normal;color:#ffffff;}
.textstyle4 {font-family:Arial;font-weight:bold;font-style:normal;font-size:10pt;text-decoration:normal;color:#ffffff;}
.textstyle5 {font-family:Comic Sans MS;font-weight:bold;font-style:normal;font-size:14pt;text-decoration:normal;color:#400040;}
.textstyle6 {font-family:Comic Sans MS;font-weight:bold;font-style:normal;font-size:8pt;text-decoration:normal;color:#400040;}
.textstyle7 {font-family:Comic Sans MS;font-weight:normal;font-style:normal;font-size:8pt;text-decoration:normal;color:#400040;}
.textstyle8 {font-family:Comic Sans MS;font-weight:bold;font-style:normal;font-size:18pt;text-decoration:normal;color:#ff0000;}
.textstyle9 {font-family:Comic Sans MS;font-weight:bold;font-style:italic;font-size:18pt;text-decoration:normal;color:#ff0000;}
</STYLE>

<STYLE TYPE="text/css">
DIV.Object84 { position:absolute; top:141px; left:13px; z-index:0; }
DIV.Object85 { position:absolute; top:16px; left:14px; z-index:1; }
DIV.Object86 { position:absolute; top:148px; left:19px; z-index:2; }
DIV.Object87 { position:absolute; top:247px; left:19px; z-index:3; }
DIV.Object88 { position:absolute; top:352px; left:20px; z-index:4; }
DIV.Object89 { position:absolute; top:460px; left:19px; z-index:5; }
DIV.Object90 { position:absolute; top:143px; left:140px; z-index:6; }
DIV.Object91 { position:absolute; top:17px; left:357px; z-index:7; }
DIV.Object92 { position:absolute; top:23px; left:365px; z-index:8; }
DIV.Object93 { position:absolute; top:10px; left:484px; z-index:9; }
DIV.Object94 { position:absolute; top:10px; left:339px; z-index:10; }
DIV.Object95 { position:absolute; top:23px; left:518px; z-index:11; }
DIV.Object96 { position:absolute; top:158px; left:553px; z-index:12; }
DIV.Object97 { position:absolute; top:198px; left:569px; z-index:13; }
DIV.Object98 { position:absolute; top:392px; left:570px; z-index:14; }
DIV.Object99 { position:absolute; top:160px; left:292px; z-index:15; }
DIV.Object100 { position:absolute; top:327px; left:140px; z-index:16; }
DIV.Object101 { position:absolute; top:340px; left:161px; z-index:17; }
DIV.Object102 { position:absolute; top:44px; left:204px; z-index:18; }
DIV.Object103 { position:absolute; top:18px; left:140px; z-index:19; }
DIV.Object104 { position:absolute; top:46px; left:395px; z-index:20; }
DIV.Object105 { position:absolute; top:186px; left:41px; z-index:21; }
DIV.Object106 { position:absolute; top:290px; left:37px; z-index:22; }
DIV.Object107 { position:absolute; top:389px; left:27px; z-index:23; }
DIV.Object108 { position:absolute; top:501px; left:38px; z-index:24; }
DIV.Object109 { position:absolute; top:157px; left:615px; z-index:25; }
DIV.Object110 { position:absolute; top:172px; left:141px; z-index:26; }
DIV.Object111 { position:absolute; top:148px; left:353px; z-index:27; }
</STYLE>
</HEAD>

<BODY LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 BGCOLOR="#ffffff" LINK="#0000ff" VLINK="#800080">
<TABLE WIDTH=740 HEIGHT=600 BORDER=0 CELLSPACING=0 CELLPADDING=0>
<TR>
<TD>

Vanaf hier komt dan de website. Ik geef je dit deel omdat ik denk dat m.n. in dit deel iets veranderd moet worden om de website in het midden te krijgen. Het spreekt vanzelf dat bij het invoegen van tags een afsluitende geneste tag hoort.

Misschien kun je er wat mee.

sgrav000
 
Laatst bewerkt:
Bestudeer dit eens:

Code:
<BODY BGCOLOR="#ffffff" LINK="#0000ff" VLINK="#800080">
<table border=0 width=100% height=100%>
<tr>
<td>
<div align="center">

<table width="750" cellspacing="5" cellpadding="1"><tr><td width="100%" bgcolor="#000000">
<table width="750" cellspacing="0" cellpadding="5"><tr><td width="100%" bgcolor="#FFFFFF">

<p>tekst</p>
<p align="center"><b>tekst</b></p>
<p align="right">tekst</p>

</td></tr></table>
</td></tr></table>

</div>

</td>
</tr>
</table>

</body>

Het gaat bij jouw mis als je een TABLE in een TABLE zet, je kan na TABLE gewoon met TR en TD je layout verder afmaken.
 
homepage midden op de pagina

Inderdaad is de code die je geeft, Caveman, op zichzelf goed voor het plaatsen van een tabel in het midden van de pagina. Ik heb dat uitgeprobeerd in een html-editor. Opvallend daarbij is dat het alleen om tekst gaat. Ik hoop niet dat er een misverstand ontstaat dat mijn probleem zou gaan over het plaatsen van een tekstblok in het centrum van mijn home page. Het gaat immers om plaatsing van mijn homepage op het midden van het scherm. Voorbeelden van deze positie zijn www.kpn.nl en www.planet.nl In beide gevallen gaat het over de positie van de homepage centraal op het scherm!
Kortom, ik heb geprobeerd <div align="center"> (en later natuurlijk </div>) na <td> in de tabel te plaatsen. Ik heb ook width en height op 100% gezet. Het haalt niets uit. De homepage blijft links uitgelijnd.

sgrav000
 
Laatst bewerkt:
homepage centraal op scherm

Dank iedereen voor de bijdragen.

De uiteindelijke (simpele) oplossing bestaat in het creëren van een grotere tabel die ook groter is dan een scherm van 19 inch, en mijn homepage daarin te centreren. Dit is wat Caveman in zijn eerste antwoord meteen al bedoelde hetgeen ik toen niet begreep. Later hebben anderen er ook nog naar gerefereerd. Nu pas is het kwartje gevallen. Ik staarde me dood naar een lege table die in de html zichtbaar was.


sgrav000
 
helaas niet opgelost

Tot mijn spijt ben ik er nog niet uit. Ik ben er in geslaagd mijn site te centreren. Maar kan nu niet meer nagaan hoe ik dat gedaan heb. Alles blijft linksuitgelijnd op het scherm. Ik heb iets na 'body' veranderd maar ik weet niet meer wat. Natuurlijk heb ik datgene 'genest''.

De gecentreerde (geslaagde) page:

<BODY LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 BGCOLOR="#ffffff" LINK="#0000ff" VLINK="#800080">

<TABLE WIDTH=100% HEIGHT=100% BORDER=0 CELLSPACING=0 CELLPADDING=0>
<TR>
<TD>
<br>
</TD>
</TR>
</TABLE>

<DIV class="Object0"><IMG SRC="Pagina0_IMG_OBJ0.jpg" WIDTH=740 HEIGHT=598 BORDER=0></DIV>

<DIV class="Object1"><IMG SRC="Pagina0_IMG_OBJ1.jpg" WIDTH=236 HEIGHT=124 BORDER=0></DIV>

<DIV class="Object2"><IMG SRC="Pagina0_IMG_OBJ2.jpg" WIDTH=336 HEIGHT=221 BORDER=0></DIV>

<DIV class="Object3"><IMG SRC="Pagina0_IMG_OBJ3.jpg" WIDTH=157 HEIGHT=190 BORDER=0></DIV>

Enzovoorts

De page die ik maar niet gecentreerd krijg op het scherm:

<BODY LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 BACKGROUND="Pagina0_IMG_BCK.jpg" LINK="#0000ff" VLINK="#800080">

<TABLE WIDTH=100% HEIGHT=100% BORDER=0 CELLSPACING=0 CELLPADDING=0>
<TR>
<TD>
<br>
</TD>
</TR>
</TABLE>

<DIV class="Object599"><IMG SRC="Pagina1_IMG_OBJ0.jpg" WIDTH=738 HEIGHT=598 BORDER=0></DIV>

<DIV class="Object600"><IMG SRC="Pagina1_IMG_OBJ1.jpg" WIDTH=26 HEIGHT=17 BORDER=0></DIV>

<DIV class="Object601"><A HREF="Pagina3.html" ><IMG SRC="Pagina1_IMG_OBJ2.jpg" WIDTH=76 HEIGHT=24 BORDER=0></A></DIV>

Enzovoorts.

Willen jullie me nog eens helpen?

Dank, sgrav000
 
Hoi, kan je de hele pagina(s) in txt-bestand als bijlage toevoegen? Met tabellen is het nou juist zo belangrijk om alle tags sluitend te hebben. Nu ik alleen het begin zie, kan ik niet nagaan of je een syntax fout hebt gemaakt.
 
de beide bestanden in tekst formaat

Hallo Caveman, hierbij beide bestanden: de een van een wel en de ander van een niet gecentreerde page. Wat doe ik fout?

Dank voor jouw meedenken
 

Bijlagen

Ik kan pas vanavond laat ernaar kijken, dus als niemand mij voor is, vraag ik wat geduld van je.
 
Je werkt met css voor de positie
<STYLE TYPE="text/css">
DIV.Object0 { position:absolute; top:0px; left:96px; z-index:0; }

En dan in de pagina het object
<DIV class="Object0"><IMG SRC="Pagina0_IMG_OBJ0.jpg" WIDTH=740 HEIGHT=598 BORDER=0></DIV>

Derhalve kun je niet je pagina centreren.
Ook het voorbeeld is niet gecentreerd:
zet je muiscursor op de rechter rand, sleep naar binnen,
en de schijnbare centratie is weg :(

:cool:
 
Laatst bewerkt:
boven mijn pet

Peter Vazed je schrijft:
Je werkt met css voor de positie............................
enzovoorts
Helaas snap ik jouw antwoord niet. Kun je me aangeven wat ik moet doen om mijn website midden op de pagina te krijgen? Moet ik iets weglaten?

Dank voor het meedenken,


sgrav000
 
Kan niet met de huidige code.

Kan alleen indien je met tabellen werkt.
Dus een andere Editor dan "Web Mijn Homepage".

De Style in de head zorgt nu voor een absolute positie van de diverse objecten.
<STYLE TYPE="text/css">
DIV.Object0 { position:absolute; top:0px; left:96px; z-index:0; }

Deze objecten zijn los van elkaar, en kun je dus nooit als één geheel in het midden van een pagina zetten.

Een tabel is één object en kan dus wel in het midden gezet worden. Bij iedere schermresolutie zal het dan ook in het midden blijven staan.

:cool:
 
En als je alle divs in nóg een div zet?

een "position:absolute" geeft een plaatsing aan tov het parent object en niet tov het browservenster.
het parent object zou dus nog een div kunnen zijn die je centreert.
Als je de nieuwe div zou centreren moet je misschien de waardes van de andere divs een beetje aanpassen.


een andere eenvoudigere optie is een frameset met kolommen maken:

<frameset cols="*,770,*" border="0">
de eerste en derde pagina's zijn leeg en geef je alleen een achtergrondkleur. De tweede is je eigenlijk pagina.

t.
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan