Breedte instellen in NVU.

  • Onderwerp starter Onderwerp starter Q45
  • Startdatum Startdatum
Status
Niet open voor verdere reacties.

Q45

Gebruiker
Lid geworden
13 dec 2007
Berichten
34
Hallo,

Ik heb een website gemaakt in NVU. Ik heb gebruik gemaakt van een tabel om mijn website goed in te delen. Ik heb de breedte voor deze tabel ingesteld op 100%.

Wanneer ik nu de site online bekijk zie ik dat de website toch niet het hele scherm vult.
Kan iemand mij uitleggen wat ik verkeerd doe en mij eventueel ook laten weten hoe ik dit beter kan doen?

Alvast hartelijk bedankt,

Q45
 
Dat is niet te zeggen zo. Mogelijk verschilt het ook nog per browser.
Heb je 'n link naar de site, zodat de code bekeken kan worden?
Terzijde: als nvu goed werkt, prima. Maar het wordt niet meer onderhouden. Het gaat verder onder de naam Kompozer. Dat is dus precies hetzelfde programma, maar nieuwere versies. De naamswijziging was nodig vanwege juridisch gedoe. Kompozer schijnt nogal wat bugs opgelost te hebben.
Als je belangstelling hebt: http://www.kompozer.net/download.php
 
Bedankt voor je snelle reactie,

Ik heb zojuist Kompozer geïnstalleerd en ik ga dit komend weekend uitproberen. Ik zal hier laten weten of de breedte instellingen hier beter zijn dan in NVU.

Ik wist trouwens niet dat NVU niet meer onderhouden werd, dus ik ben zeker al geholpen door nu over te stappen op Kompozer.


Ontzettend bedankt,

Q45
 
Aangezien het vanavond 'n speciale avond schijnt te zijn, heb ik wat weinig tijd meer :p
Dus even snel. Alvast de beste wensen.

Ik heb even snel gekeken.
Als je in de css bij border toevoegt
Code:
{margin: 0; padding: 0;}
denk ik dat de ruimte is opgelost. Verschillende browsers voegen een padding en/of margin toe aan de body, die ook nog 'ns verschilt per browser. Daarom kun je die 't best altijd op 0 zetten (of 'n andere waarde opgeven natuurlijk), dan is 't overal 't zelfde.

Ik zou je aanraden inderdaad Kompozer te gaan gebruiken, want die levert absoluut betere code af dan z'n voorganger nvu.
Zo is 't doctype van nvu incompleet. (Ik was die bug alweer vergeten). Dat betekent dat er 'n grote kans is dat in Internet Explorer je lay-out totaal anders wordt weergegeven dan in andere browsers, of zelfs dat delen van je site gewoon helemaal verdwijnen.
Mocht je 't met de hand willen veranderen, het doctype hoort te zijn:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

Het kan zijn (dat hoop ik eigenlijk) dat Kompozer 'n strict doctype gebruikt.
Even nagekeken. Ja, inderdaad. Dat betekent dat de opmaak meer gescheiden wordt van de inhoud (tekst e.d.). Dat is beter toegankelijk voor bijvoorbeeld blinden, maar ook voor zoekmachines.
Bovendien is het dan veel makkelijker je site te veranderen of met de hand fouten in de code te verbeteren. En het is compatibel met toekomstige versies van html e.d.

Je zou kunnen overwegen om even opnieuw te beginnen, want je site is nog niet heel groot.

edit: even opnieuw beginnen met Kompozer bedoel ik.
 
Laatst bewerkt:
Bedankt weer voor de snelle info.

Ik stop er nu ook mee. Ik wens je een hele prettige jaarwisseling toe en alvast de beste wensen voor 2010.

Groeten,

Q45
 
Hallo Goeroeboeroe,

Allereerst wil ik je een gezond en gelukkig 2010 wensen.

Ik heb de informatie in jouw vorige post bekeken. Het stukje over de css codes aanpassen begrijp ik niet.
Ik heb wel in de "Table Properties" bij border, spacing en padding de waarde 0 ingevuld. Ik gebruik verder geen css.

Ook in Kompozer houd ik de ruimtes over.

Ik hoop dat je me nog verder kunt helpen.

Alvast hartelijk bedankt,

Q45
 
Hoi Q45,
Bedoel je de tabel waar het eerste <iframe> naar Amazon in staat (zeg maar: de derde strook van boven)?
Die laat aan de linkerkant witruimte zien. Als dat het is, dan:
  • komt dat omdat het <iframe> een opgegeven breedte heeft van 728px, en
  • omdat de cel <td> waar het <iframe> in zit, geen opgegeven breedte heeft, en
  • omdat deze cel alles aan de rechterkant zet: style="text-align: right;"
  • dit kan je zien in de broncode (tabblad Source).
Nu kan je deze strook niet uitsmeren over de hele breedte, omdat in het <iframe> zelf, d.w.z. op de pagina die bij Amazon wordt opgehaald, een breedte van 726px staat; daar valt niets aan te veranderen.
Wat je wel zou kunnen doen, is het <iframe> mooi in het midden van de tabel zetten. Dat kan met het aanpassen van de tabelcel van het <iframe>. Daarin staat nu:
HTML:
<td style="text-align: right;">
Daarvan zou je kunnen maken, via de "Table Cell Properties":
HTML:
<td style="width: 728px; text-align: center;">
Wat eerst het witte gat aan de linkerkant was, is nu evenveel wit links en rechts van de Amazon-dingen geworden. Je kunt deze strook nog een bescheiden achtergrondkleurtje geven, dan valt het wit links en rechts voor het oog wat minder op. Dan wordt het bijvoorbeeld:
HTML:
<td style="width: 728px; text-align: center; background-color: #FFFF99;">
Wat Goeroeboeroe bedoelde met "in de css toevoegen", was (als ik even voor m'n beurt mag spreken ;) ) dat het het mooiste is om alle layout-zaken van de verschillende onderdelen van de pagina apart te zetten.
Dat gaat met een zogenaamd "CSS stylesheet".
Nu staan sommige stijl-opdrachten rechtstreeks in de html, als je in het tabblad Source kijkt. Bijvoorbeeld:
  • in regel 25 staat <tr align="center">
Andere stijl-opdrachten zitten er wel in als CSS, maar dan als "inline styles". D.w.z. dat ze met style="..." in een html-regel zitten. Bijvoorbeeld:
  • in regel 26 staat <td style="background-color: rgb(153, 153, 153);">
Dat heeft KompoZer er zo ingezet via de TableCellProperties in de Normale Weergave.
  • Maar je kunt het ook doen door deze <td> (tabel-cel) een eigen kenmerk te geven, en alle andere layout-dingen ook.
  • Vervolgens maak je dan een "CSS-stylesheet" (stijlblad) waarin alle kenmerken mooi op een rijtje verbonden worden aan de stijlen die ze nodig hebben.
Dan worden de html-codes mooi overzichtelijk, en kan je ook in één klap (door iets in het stylesheet te veranderen) bv. de achtergrondkleur van al je pagina's in de site tegelijk veranderen. Want, dat is ook een groot voordeel, aan alle pagina's kan je hetzelfde stylesheet koppelen. Dan hoef je niet telkens opnieuw de layout per pagina uit te vinden of te kopieren/plakken. En ook kunnen de tabellen voor de layout helemaal vervallen! De html-pagina's worden er lekker klein van, en staan ook sneller op scherm.
CSS = Cascade Style Sheet.
Dat heet zo, omdat deze manier een Cascade (waterval) logica heeft. Het moet even wennen, maar dan kun je er waanzinnig handig gebruik van maken. In KompoZer kan je er komen met de knop "CaScadeS" (het paletje) helemaal rechts.
Maar als je CSS nog niet kent, zou ik er eerst eens wat over lezen, bijvoorbeeld in de Handleiding Html.

Succes!
CSShunter
 
Dan ga ik na m'n beurt spreken :D
Ik dacht eigenlijk dan nvu altijd met 'n extern stylesheet werkte, Inmiddels heb ik, vanwege 't aantal vragen erover, toch 'ns Kompozer geïnstallerd. En 't blijkt dat je dat handmatig op moet geven.
Dus ik bedoelde wel dat 't extern kon, maar ik dacht dat er al 'n extern stylesheet was.

En mijn oplossing was dus niet afdoende (marge/padding op 0 bij body). Had even snel gekeken.

Ik heb wat zitten spelen met Kompozer. Niet heel uitgebreid, want ik ga 't toch niet gebruiken. Ik heb in ieder geval gezien dat er 'n enorme serie bugs uit is gehaald, vergeleken met nvu (waaronder dat foutieve doctype).
Maar als ik 't goed begrijp, moet je zelf aangeven dat je met 'n extern stylesheet gaat werken. Als je dat niet doet, krijg je dus dat oerwoud aan interne stijlen.
Oftewel: het is echt nodig dat je iets van css leert, want anders kun je nooit de css-editor van Kompozer gebruiken.
Ik geef trouwens zelf sterk de voorkeur aan de cursus op http://www.web-garden.be/
omdat die html en css in 'n gecombineerde cursus geeft, en omdat die uitgebreid ingaat op het gebruik van divs in plaats van tabellen voor de lay-out.
 
Laatst bewerkt:
Dan ga ik na m'n beurt spreken :D
Ik verwachtte al zoiets! ;)

[beetje offtopic]
Ja, ik heb ook even KompoZer bekeken; maar hoe je nu even snel een class of id toevoegt (in de NormalView), daar kom ik niet achter. En al die venstertjes voor als je iets aan de CSS wilt veranderen... Eigenlijk moet je al precies weten wat alles doet, voordat je die venstertjes goed kan gebruiken. Maar dan kan je het veel vlugger even zelf in de broncode regelen (hoef ik "alleen even" CSS te leren, i.p.v. CSS + gebruiksaanwijzing KompoZer).
Iets dergelijks overkwam me trouwens ook toen ik eens een proefversie van Dreamweaver had geïnstalleerd. Geef mij maar het handwerk. :)

Die Webgarden-cursus kende ik nog niet, ga ik van de kerstvakantie eens op m'n gemak lezen: ik heb nog 1 dag. :(
[/beetje offtopic]

Gegroet, en <goed>2010</goed>!
CSShunter
 
Bedankt voor jullie uitgebreide informatie.

Ik ga me hier de komende tijd verder in verdiepen.

Voor mij zijn hiermee voorlopig de problemen opgelost.


Hartelijk bedank,

Q45
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan