login  Naam:   Wachtwoord: 
Registreer je!
 Forum
Zoeken  Regels  Help

Categorieën > HTML & CSS > tekst en tabel

Onderwerp: tekst en tabel (Opgelost)
Door: joeyask
Op: 06/02/2010 23:48
Laatste wijziging: 06/02/2010 23:57
Offline offline




Nieuw lid
hallo sitemasters,

ik heb een scriptje met html en css,

en heb een klein probleempje.

ik heb een tekst en een tabel,

maar dat komt niet naast elkaar te staan.

wie kan mij zeggen hoe ik dat wel naast elkaar kan plaatsen??

mvg joey,
  1. <title>keeway fact 50</title>
  2. <style type="text/css">
  3. <!--
  4. body {color:white; font-family:verdana; background-color:#333333;}
  5.  
  6. h2 {color:#993333; font-family:times new roman; font-style:italic;}
  7.  
  8. p {color:white; font-family:verdana; text-decoration:underline}
  9.  
  10. a:link { color: red }
  11. a:visited { color: #993333 }
  12. a:hover { color: purple }
  13. a:active { color: green }
  14.  
  15. .container {
  16. margin: -19px auto;
  17. border: 1px solid #white;
  18. width: 900px;
  19. height: 100px;
  20. background-color:black;
  21. }
  22.  
  23.  
  24. -->
  25.  
  26. </head>
  27.  
  28.  
  29.  
  30. <div class="container"><h2>mijn scooter!</h2></font>
  31. <p>dit is mijn scooter.<br>
  32. het is een keeway f-act 50.<br>
  33. bouwjaar 2008.</p>
  34.  
  35. <a href=""=""></a>
  36.  
  37.  
  38.  
  39. <img src="C:\Users\joey\Desktop\camera\Foto0020.jpg" widht="250" height="230">
  40.  
  41. <table border="1" bgcolor="#333333">
  42. <tr>
  43. <td><LI>menu</LI></tr></td>
  44. <tr><td>
  45. <LI>mijn scooter.</LI></tr></td>
  46. <tr>
  47. <td><LI>over mij.</LI></tr></td>
  48.  
  49. <a href="mailto:joey_de_best1@hotmail.com">mail voor meer info!</a>
  50. </div>
  51.  
  52. </body>
  53. </html>



Pagina:

Door: Martijn
Op: 07/02/2010 00:15
#1
Offline offline



Admin
http://validator.w3.org/#validate_by_input

zet daar je code is in en maak eerst eens die fouten die het geeft.

Bijvoorbeeld:
Je opent <center> (uberhaupt al een slechte code!), daarna je container <div>, dan je <p> met tekst. Daarna sluit je de <p>, daarna de <center> en dan je <div>

Dus, je div zet je in je center, maar je sluit m erna...?

Door: joeyask
Op: 07/02/2010 00:31
#2
Offline offline



Nieuw lid
ja omdat anders de rest ook wordt gecentreerd wat ik dus niet wil,

ik vind de code: <center> wel fijn werken, misschien oud maarja..


Door: Deloo
Op: 07/02/2010 11:21
Laatste wijziging: 07/02/2010 11:22
#3
Offline offline



Nieuw lid
Je moet echt wel meer aandacht besteden aan je code... In je tabel open je eerst de rij en dan de kolom (dat is nog juist) maar dan sluit je eerst je rij en dan pas je kolom... De juiste structuur is als volgt:

  1. <tr>
  2. <td>menu</td>
  3. </tr>
  4. <tr>
  5. <td>mijn scooter</td>
  6. </tr>
  7. <tr>
  8. <td>over mij</td>
  9. </tr>



Het is ook beter om alle opmaak in je CSS bestand te zetten. Als je dan later de lay-out van bijvoorbeeld je tabellen wil veranderen moet je maar één bestand aanpassen in plaats van al je HTML bestanden...

Nu over je vraag. Ik denk dat het best is dat je je tekst en je tabel in twee aparte div's zet en deze dan via CSS naast elkaar laat liggen. Dit kun je door het volgende in je CSS-bestand te zetten

  1. .container {
  2. float: left;
  3. }
  4.  
  5. .tekst {
  6. float: left;
  7. }



Let er natuurlijk op dat de naam van je div in je CSS bestand en je HTML bestand overeenkomen...

Door: hrnsykk
Op: 07/02/2010 21:55
Laatste wijziging: 08/02/2010 15:35
#4
Offline offline



Nieuw lid
probeer jij het maar zo

  1. Verwijderd


Martijn schreef:
Deze code was zeer onjuist!

Door: joeyask
Op: 07/02/2010 22:15
#5
Offline offline



Nieuw lid
ik kom er niet egt uit, maar vind het fyn dat mensen me wel proberen te helpen:D

Door: hrnsykk
Op: 07/02/2010 22:26
#6
Offline offline



Nieuw lid
kunt u het paint tekenen en doorsturen

Door: Martijn
Op: 08/02/2010 12:22
#7
Offline offline



Admin
zo, voordat je verder gaat met vragen, gaan we eerst je site fixen.
@hrnsykk 1: Jouw code is mogelijk nóg fouter.
@hrnsykk 2: We doen niet aan paint we maken een screenshot, of we geven een werkend voorbeeld.
-----
1. Je CSS, regel 6 tot regel 23, zet je in een nieuw bestand, een css bestand. Zie Beginnen met Css
-----
2. de <center> van regel 34 haal je weg, en de sluitende tag ook. Als je wilt dat dat stuk gecentreerd wordt, zet je style="text-align:center" in de div op regel 35. Met <center> kom je alleen weg als je op de basisschool zit.
-----
3. Je hebt <LI> in je table. Allereerst schrijven we tags in kleine letters, <li> dus, ten tweede is LI kort voor List Item, en dat hoort niet zo thuis in een tabel. Zie HIER de juiste manier van LI
Als je zo;n balletje voor je tekst wilt doe je &bull;
-----
4.
-Op regel 36 heb je </font> maar nergens open je die -> weghalen.
- Je hebt als IMG source een absolute path. Zet je dit online werkt het niet. De foto in je html map zetten, en dan alleen foto.jpg neerzetten
- Je hebt in je img widht, dat moet width zijn
- Regel 40 -> a href=""=""> ?
-----
5. DOWNLOAD FIREFOX! en daarna htmlTidy. En leer er mee omgaan


Pas weer vragen stellen als je het bovenstaande gemaakt heb ;)

Door: joeyask
Op: 08/02/2010 17:50
Laatste wijziging: 08/02/2010 19:16
#8
Offline offline



Nieuw lid
oke heb alles verander:D

maar ik gebruik trouwens html-kit, weet niet of dat een goed programma is?

dit is nu mijn code:

  1. <title>keeway fact 50</title>
  2.  
  3. <link rel="stylesheet" href="style.css" type="text/css">
  4.  
  5. </head>
  6.  
  7. <div class="container" style="text-align:center">
  8. <h2>mijn scooter!</h2>
  9. dit is mijn scooter.<br>
  10. het is een keeway f-act 50.<br>
  11. bouwjaar 2008.<br>
  12.  
  13. <img src= "scooter.jpg" width= "350" height="230">
  14.  
  15.  
  16.  
  17. <table border= "1" bgcolor= "#333333">
  18. <ul>
  19. <tr>
  20. <td>
  21. <li>
  22. <a href="1e.htm">mijn scooter.</ul></tr></td></li></a>
  23. <tr>
  24. <td>
  25. <li>meer foto's.</tr></td></li>
  26. <tr>
  27. <td>
  28. <li>over mij.</tr></td></li></table></ul>
  29.  
  30.  
  31. <a href= "mailto:joey_de_best1@hotmail.com">mail voor meer info!</a>
  32.  
  33.  
  34. <p align="center"><embed src= "C:\Users\joey\Desktop\muziek\John Cena - My Time Is Now.mp3" width="140" height="50" autostart="false" loop="false">
  35.  
  36. </div>
  37.  
  38. </body>
  39. </html>


Door: Martijn
Op: 08/02/2010 19:16
#9
Offline offline



Admin
Het is een heel stuk beter. Allen heb je nog een foutje, maar die zal tidy je vertellen.

Je vroeg via bericht hoe, ik zal het hier even uitleggen:
rechtsonder staat een icoontje met een kruisje, of een 'goedvink'-vinkje, of een vraagteken. Als je daar op dubbelclicked krijg je een scherm met de bron (het is ook toegankelijk door ctrl+U te toesten).
Linksonder heb je een vak met fouten, met als je daar op klikt de manier om te verbeteren rechtsonder

Door: joeyask
Op: 08/02/2010 19:31
Laatste wijziging: 08/02/2010 19:33
#10
Offline offline



Nieuw lid
oke heb het met de programma opgeschoond en dit is er van geworden:

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. keeway fact 50
  4. </title>
  5. <link rel="stylesheet" href="style.css" type="text/css" />
  6. </head>
  7. <body>
  8. <div class="container c3">
  9.  
  10. <h2>mijn scooter!</h2>
  11. dit is mijn scooter.<br />
  12. het is een keeway f-act 50.<br />
  13. bouwjaar 2008.<br />
  14. <img src="scooter.jpg" width="350" height="230" />
  15. <table class="c1" border="1">
  16. <tr>
  17. <td>
  18. <ul>
  19. <li>
  20. <a href="1e.htm">mijn scooter.</a>
  21. </li>
  22.  
  23. </td>
  24. </tr>
  25. <tr>
  26. <td>
  27. <ul>
  28. <li>meer foto's.
  29. </li>
  30. </td>
  31. </tr>
  32. <tr>
  33. <td>
  34. <ul>
  35. <li>over mij.
  36. </li>
  37. </td>
  38. </tr>
  39. </table>
  40. <a href="mailto:joey_de_best1@hotmail.com">mail voor
  41. meer info!</a>
  42. <p class="c2">
  43. <embed src=
  44. "C:/Users/joey/Desktop/muziek/John%20Cena%20-%20My%20Time%20Is%20Now.mp3"
  45. width="140" height="50" autostart="false" loop="false" />
  46. </p>
  47. </div>
  48. </body>
  49.  
  50. </html>



Pagina:

Je moet ingelogd zijn om een reactie te kunnen posten...
Actieve forumberichten:

© 2002-2010 Sitemasters.be - Regels - Gehost door: Netfeed - Laadtijd: 0.087s