Tekst goed geplaatst krijgen

Status
Niet open voor verdere reacties.
B

Bladekid

Gebruiker
Lid geworden
7 jan 2008
Berichten
7
Hallo,

Ik heb gisteren deze site gevonden.
Een heel fijne site en heb er al veel interessante dingen kunnen vinden (slijm, slijm).

Ik zit met een probleem(pje) maar heb helaas nog geen antwoord kunnen vinden.
Ik ben met een site bezig en wil nu tekst plaatsen maar krijg dat niet goed voor elkaar (ik zal de code zo meesturen zodat jullie weten wat ik bedoel).
Ik heb de site opgebouwd m.b.v. tabellen en nu wil ik in het middelste gedeelte tekst plaatsen. Ik heb bijvoorbeeld geprobeerd tekst in een layer te plaatsen maar als ik dat doe kan deze niet exact positioneren. Het is ieder geval de bedoeling dat de hoogte van de te plaatsen tekst lijnt met het menu links en de onderkant van de tekst lijnt met de onderkant van de foto rechts.

Hebben jullie hier een goede oplossing voor?

Onderstaand de code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:983px;
height:659px;
z-index:1;
}
#Layer2 {
position:absolute;
width:671px;
height:431px;
z-index:2;
left: 78px;
top: 105px;
}
body {
background-repeat: no-repeat;
}
#Layer4 {
position:absolute;
width:283px;
height:349px;
z-index:2;
left: 652px;
top: 166px;
background-image: url(../Foto%27s-logo%27s/nicolette-pasfoto-duotoon.eps);
}
.style2 {
font-family: "Arial Rounded MT Bold";
font-size: 12px;
}
#Layer5 {
width:403px;
height:348px;
z-index:3;
left: 208px;
top: 166px;
overflow: auto;
}
-->
</style>
</head>

<body>
<table width="955" height="600" border="0" align="center" cellspacing="0" cellpadding="0">
<tr>
<td width="200" rowspan="3"><img src="../Geknipt/Links-menu.gif" width="200" height="600"/></td>
<td width="400" height="150" background="../Geknipt/Middenboven.gif"></td>
<td width="355" rowspan="3" background="../Geknipt/Rechts-fotoruimte.gif"><div id="Layer4"></div></td>
</tr>
<tr>
<td height="350" background="../Geknipt/Midden-hoofdtekst.gif"><p class="style2"></p>
</td>
</tr>
<tr>
<td height="100" background="../Geknipt/Middenonder.gif">&nbsp;</td>
</tr>
</table>
</body>
</html>

Alvast bedankt voor jullie reacties!
 
Laatst bewerkt:
Heb je deze pagina ook online staan? Aangezien je afbeeldingen laad welke wij dus niet hebben is het wat handiger dat wij het totaal kunnen zien :)

Overigens is het voor ons wat fijner wanneer je de code tussen
HTML: 
...
 zet. ;)
 
Sorry, ik zal de site (wat ik tot nu toe heb) online zetten en zal de link zo doorgeven.
 
Excuses is niet nodig, als je niet van het bestaan van die tags weet kun je ze ook moeilijk gebruiken ;)

Daarnaast is een online voorbeeld voor ons in dit geval net iets handiger zodat we weten welke foto je bedoelt. :)
 
Hierbij even je aangepaste code.
Borders geven in ontwerpmode aan wat waar staat,

PHP: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:983px;
height:659px;
z-index:1;
border:2px solid #ff0000;
}
#Layer2 {
position:absolute;
width:671px;
height:431px;
z-index:2;
left: 78px;
top: 105px;
border:2px solid #ff0000;}
body {
background-repeat: no-repeat;
}
#Layer4 {
position:absolute;
width:283px;
height:349px;
z-index:2;
left: 652px;
top: 166px;
background-image: url(../Foto%27s-logo%27s/nicolette-pasfoto-duotoon.eps);
border:2px solid #ff0000;
}
.style2 {
font-family: "Arial Rounded MT Bold";
font-size: 12px;
}
#Layer5 {
width:403px;
height:348px;
z-index:3;
left: 208px;
top: 166px;
overflow: auto;
border:2px solid #ffff00;}
-->
</style>
</head>

<body>

<div id="Layer1"></div>
<div id="Layer2"></div>
<div id="Layer3"></div>
<div id="Layer5"></div>

<table style="height:600px;width:955px; " border="0" align="center" cellspacing="0" cellpadding="0">
<tr>
<td width="200" rowspan="3"><img src="../Geknipt/Links-menu.gif" width="200" height="600" alt="pl" /></td>
<td width="400" height="150" style="background-image:url(../Geknipt/Middenboven.gif);"></td>
<td width="355" rowspan="3" style="background-image:url(../Geknipt/Rechts-fotoruimte.gif);border:2px solid #ff0000;"><div id="Layer4"></div></td>
</tr>
<tr>
<td height="350" style="background-image:url(../Geknipt/Midden-hoofdtekst.gif);"><p class="style2"></p>
</td>
</tr>
<tr>
<td height="100" style="background-image:url(../Geknipt/Middenonder.gif);">&nbsp;</td>
</tr>
</table>
</body>
</html>

Gooi je site of url altijd in:
http://validator.w3.org/
om vroegtijdig fouten op te sporen.

Je probleem zit naar alle waarschijnlijkheid in je absolute aanduiding in de style.

:cool:
 
Hoi Peter en Da Devil,

Peter,
Ik heb de code aangepast zoals jij hebt aangegeven maar ik heb de borders maar even weggehaald en ook de codes <div id=Layer1"></div> enz. omdat ik hierdoor heel veel witruimte boven de pagina krijg.

Ik heb de pagina en afbeeldingen staan op http://members.home.nl/diligentia/

Wat ik nu wil is dat er tekst komt te staan in het blauwe gedeelte dus tussen het menu en de foto.
Maar als ik nu een layer plaats en daar tekst in kopieer dan kan ik de layer niet meer verplaatsen dus niet meer exact positioneren.
Hoe krijg ik nu de tekst precies op de plek waar ik het wil hebben?
 
Nou, je wilt het mooi maken, maar dit gaat dus mooi niet op.

Bekijk je site, trek de rechterbrowserschemlijn naar binnen, ziet wat er gebeurt.
Scherm wordt dus smaller.

Hoe wil je straks het menu gaan doen?
De linken dus?

Ik neem aan dat je de vormgeving, welke je nu hebt zo wilt houden.
En dat er tekst in het middenvlak moet komen.

Je hebt trouwens mijn code, welke w3.org was goedgekeurd foutief aangepast,
maar dit terzijde.
Komt wel goed.

Dus, wat wens je?
Layout zoals nu, tekstvlak alleen in het midden,
of ingeval met meer tekst in het middendeel, dat de pagina hoger wordt en er gescrolled moet worden?

:cool:
 
Ik weet het, ik ben eigenwijs, maar dat moet af en toe kunnen, toch?

Maar ik begrijp nu wat je bedoelt, waar is mijn menu nu gebleven???

Maar iedereen heeft toch tegenwoordig minimaal een 15"-scherm en ik heb het op een laptop met een 15"-scherm bekeken en daar was wel alles in zijn geheel te zien? Zou dan toch geen probleem moeten zijn? M.a.w. deze lay-out zou toch moeten passen?

Wat ik wens, en hopelijk ook gaat lukken, is dat de lay-out gehandhaafd blijft en dat er alleen dus tekst in het middendeel komt. Ingeval van langere tekst dat de pagina niet hoger wordt maar dat er een vertikale scrollbar verschijnt waar je mee kan scrollen.
Hopelijk ben ik een beetje duidelijk zo.

Dank jullie wel tot nu toe!
 
Met het menu bedoel ik dat je nu een plaatje hebt,
hoe denk je de linken te gaan maken?

Het middendeel snap ik nu.
Moet kunnen met een div en overflow (scrolbalken).

Vogel er maar mee verder,
dan zal ik ook kijken of ik er iets van kan breien.
Kan even duren, maar de week is nog jong.

:cool:
 
Dit wordt dus de eerste pagina, Even voorstellen is dan wit, de rest van het menu rood.
Van de rest van het menu maak ik hotspots die dan linken naar de gerelateerde pagina's, ik moet dan van elk menu een afzonderlijk plaatje maken met elke tekst in het wit (misschien beetje omslachtig).
Dus als je op Ontstaan van... klijkt wordt er onstaan van...html geladen waarvan dit woord dan wit is (de rest van het menu rood), de tekst die daarbij hoort moet dan in het middengedeelte geladen worden en rechts verschijnt dan een bijbehorende afbeelding.
Ik kan natuurlijk ook van de tekst in het middengedeelte een plaatje maken en dan laden, zijn we ook van het positioneren af maar ik wil het eigenlijk goed (zoals het hoort) opgelost hebben.

Maar samen komen we er vast wel uit.

Ga nu maar eens slapen, mijn hoofd zit nu een beetje te vol met Dreamweaver!
 
Ha die Peter,

Heel erg bedankt voor je opzet. Dit is wat ik bedoelde.:thumb:
Ik ga ermee aan de slag, ga de teksten plaatsen en kijken of het allemaal goed gaat maar dat zal wel.
En zo niet, dan zie je me weer op het forum.

Groeten,
Bladekid:thumb:
 
stel de vraag a.u.b. als opgelost in anders zit ik hele topics te lezen en is de vraag al opgelost, alvast bedankt
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan