Vraag over Div Tag

Status
Niet open voor verdere reacties.
M

maartjebeginner

Gebruiker
Lid geworden
13 feb 2010
Berichten
16
Ik ben bezig met een website maken, en met veel geklooi begint het vorm te krijgen.
Ik heb de website eerst opgemaakt en een tekstblok met een Div Tag gemaakt.
Nu wil ik alles verplaatsen in een tabel om zo de website te kunnen centreren, maar dan verplaatst de Div Tag niet mee, waardoor de tekstblok verkeerd komt te staan.

Heeft iemand enig idee hoe ik dit kan oplossen?
Alvast bedankt voor de reactie!
 
Staat je website online zodat we misschien kunnen kijken? of het je een stukje code?
 
De website staat niet online, maar hier de code die ik heb.
Ik ben niet goed in die codes en een echte beginner, dus er zullen vast wat fouten in zitten!



<!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=utf-8" />
<title>Untitled Document</title>
<link href="tekstblok.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="tekstblok">TESTTESTTEST<br />
<br />
<br />
<br />
TEST<br />
TET<br />
TEST<br />
TEST<br />
TE<br />
</div>
<table width="200" border="0" align="center">
<tr>
<td><img src="index.png" width="750" height="550" border="0" usemap="#Map" /> </td>
</tr>
</table>

<map name="Map" id="Map"><area shape="rect" coords="24,166,189,205" href="test3.html" />
</map></body>
</html>
 
Hier nog een printscreen van wat er gebeurd...
 

Bijlagen

  • dit is wat er gebeurd.jpg
    dit is wat er gebeurd.jpg
    88,6 KB · Weergaven: 29
Maar wat wil je dan precies?

Je div tag in een tabel om hem zo te centreren?
Of wil je die tekst in het midden?

zou je misschien ook even dat index.png plaatje naar me op kunnen sturen? en je css
 
Zoals op de printscreen te zien is, komt de tekst in het menu zodra ik het tabel centreer.
Misschien ben ik wel helemaal verkeerd bezig. Maar ik wil graag dat de website gecentreerd staat met een witte achtergrond.

Zoiets als http://www.theo.nl, alleen dan meer beeldvullend.

Plaatje index is toegevoegd!
 

Bijlagen

  • index.png
    index.png
    80,3 KB · Weergaven: 20
Oke, nouja laat ik eerst dit zeggen! het is zowieso nu al niet meer echt gebruikelijk om een website met tables te maken! Tegenwoordig worden er alleen nog maar met divs gewerkt. Div zijn via een .css bestand makkelijk op te maken en tabellen niet.

Ik zal wel even kijken wat ik voor je kan doen!
 
Ja ik had ergens gelezen op het forum dat als je de site wil centreren het gemakkelijkst is om alles in een tabel te verplaatsen.
En verder heb ik geprobeerd om een div te maken en daar het plaatje index.png in te zetten, en hierover weer een div maken om daar de tekst in te zetten. Alleen dat werkte niet, maar wat ik zeg ik heb er weinig verstand van.

Ik vind het vooral makkelijk om de tekst los in dreamweaver te zetten, zodat ik snel en makkelijk veranderingen in de tekst kan aanbrengen.

Bedankt voor je hulp alvast!
 
Ja precies!
De tekst naast de menubalk.
Ik had ook nog een voorbeeldje voor mijzelf gemaakt in Photoshop, zo zie je precies wat ik bedoel!
 

Bijlagen

  • layout_icoontjes rechts.jpg
    layout_icoontjes rechts.jpg
    42,7 KB · Weergaven: 20
Hoi, ik ben nu thuis en heb er nog even naar gekeken. Ik heb dat divje netjes naast je menu gezet. Alleen kan je er nog niet veel mee! want in je content div, dus waar je plaatje in zit zegmaar, is heel statisch, je knoppen zitten in een plaatje en die moeten daar los van komen, ook weer in divjes. Ik hoop dat je het een beetje begrijpt. plak de codes hieronder in de juiste bestandsnamen en kijk maar even of het werkt

Suc6 :thumb:

Index.html
HTML: 
<!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=utf-8" />
<title>Untitled Document</title>
<link href="tekstblok.css" rel="stylesheet" type="text/css" />
</head>

<body>
    <div id="container">
        <div id="content">
            <div class="tekstblok"><h1>Welkom op de portfoliosite van Maartje van Suijdam</h1>
            <p>Deze portfoliosite geeft een inzicht in mijn studieloopbaan en toekomstige carriere. Momenteel ben ik tweedejaars student aan de opleiding Communicatie op de Hanze Hogeschool Groningen.</p>
            
            <p>Mijn specialiteiten zijn Evenementen en PR. Door middel van stages en een bijbaan heb ik mij verder kunnen ontwikkelen in deze richtingen binnen de branche communicatie. Mijn ambitie is om een succesvol eventmanager te worden met oog voor detail waardoor de opdrachtgever een onvergetelijk evenement meemaakt.</p>
            
            <p>Op deze site vind u persoonlijke informatie, mijn behaalde portfolio en mijn contactgegevens.</p>
            </div>
        </div>
    </div>
</body>
</html>


tekstblok.css
Code: 
@charset "utf-8";
/* CSS Document */

    a:link {text-decoration: none; color: red; font-family: Calibri, Arial, Helvetica, sans-serif; font-size: 12px;}
	a:visited {text-decoration: none;}
	a:hover {text-decoration: none;}
	a:active {text-decoration: none;}

body {
	margin: 0;
	background-color: #ffffff;
    background-repeat: no-repeat;
	font-family: Calibri, Verdana, Arial, Tahoma;
	font-size: 12px;
	color: #7b9da7;
}

#container{
	width: 750px;
	height: 550px;
	margin: 0 auto; 
}

#content{
    margin: auto;
	position: absolute;
    background-image: url('index.png');
	width: 750px;
	height: 550px;
}

.tekstblok{
    position: absolute;
    top: 165px;
    left: 210px;
}

h1{
	margin: 0px;
	font-family: Calibri, Verdana, Arial, Tahoma, sans-serif;
	font-size: 14px;
	color: #7b9da7;
}

p{
	margin-top: 10px;
	font-family: Calibri, Verdana, Arial, Tahoma, sans-serif;
	font-size: 12px;
	color: #7b9da7;
}
 

Bijlagen

  • index.png
    index.png
    80,3 KB · Weergaven: 23
Dank je wel dat je het voor me hebt uitgezocht!
Ik ga het morgen gelijk proberen en je leest hier wel of het me lukt of niet...
 
maartjebeginner zei:
En verder heb ik geprobeerd om een div te maken en daar het plaatje index.png in te zetten, en hierover weer een div maken om daar de tekst in te zetten. Alleen dat werkte niet, maar wat ik zeg ik heb er weinig verstand van.
Klik om te vergroten...

Verder kan ik je ook nog deze website aanraden, toendat ik ongeveer 3 maanden geleden begon met divje enzo, heb ik deze tutorial gevold en kan sindsdien wel redelijk overweg met divje e.d.

http://modernmarkup.nl/html-css/
Hierin wordt stap voor stap uitgelegd hoe je het beste met html en divjes kan werken.
 
Ik heb de codes erin gezet en het werkt!
Alleen wat je al zei over mijn menu dat werkt nu niet inderdaad.
Wat is nu het handigst voor mij? Want hoe de tekstblok nu staat is perfect!
Moet ik nu het plaatje zonder koppen maken en die erin zetten en door middel van divs daarin weer een menu maken?

Echt bedankt voor je hulp, want dit heeft me al weer een heel stuk geholpen!!:)
 
Ik ben nog even verder gaan zitten klooien en gekeken hoe jij het hebt gedaan.
En ik begrijp het nu!
Voor het menu heb ik nieuwe css gemaakt en het werkt!

Onwijs bedankt voor je hulp, dit bespaart heel veel frustraties haha!:)
 
Ik loop alleen nog ergens tegenaan.
Ik ben bezig met de div's voor het menu. Als ik de site open in browser Explorer, dan staat hij op de goede plek. Maar in Dreamweaver zelf staat hij (in Design) heel ergens anders. Hoe kan dit?
 
Oke dat is mooi! Alleen nog 1 ding! voor je menu moet je inderdaad die knoppen uit je achtergrond halen en met divjes gaan werken, dat doe je al goed. Maar je hoeft niet perse een nieuw css document aan te maken! je kan gewoon in het zelfde css document verder schrijven! dus in het document: kladblok.css! En als je ergens nog niet uitkomt kan je het altijd nog vragen!

Succes verder! :thumb:
 
Ow, dat heb ik nu wel gedaan.
Maargoed werk is al verricht en alles doet het, dus ik ben tevreden!:)
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan