quote:Op maandag 14 november 2011 21:29 schreef Dimens het volgende:
Dit is wat ik nu heb:SPOILER: HTMLOm spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.SPOILER: CSSOm spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.Het foutje met de header is eruit, die staat nu in elke browser goed. Helaas kan Internet Explorer nog steeds niet goed omgaan met de list.
Hoe doen jullie dat?Ik weet niks van Hindoes. Wel van Samoerai en andere dingen.
1 2 3 | ul { margin: 0; } |
Wat dacht je van alle margins van alle <ul>'s op 0 zetten?quote:Op maandag 14 november 2011 21:41 schreef Dimens het volgende:
Ik heb het gevonden en heb het volgende toegevoegd aan de CSS.
[ code verwijderd ]
Met dank aan boem-dikkie.![]()
Al ben ik er nog niet precies achter wat dit nu eigenlijk doet.
Volgens mij zet IE standaard een margin van 20px op de UL terwijl Chrome, Firefox en Safari dit op de LI doen. Want zodra ik margin-left: 0px; weg haal bij LI, dan staat het menu in Internet Explorer nog perfect links maar is deze in Chrome etc. weer niet goed en kom je bij hetzelfde punt aan.quote:Op maandag 14 november 2011 21:43 schreef boem-dikkie het volgende:
Waarschijnlijk heeft de User Agent stylesheet van IE een standaard margin van 20px of iets dergelijks op een ul staan. Als je dat niet duidelijk genoeg 'omschrijft' aan IE snapt hij het niet. IE een soort mongooltje, die moet je alles precies zo en niet anders uitleggen anders doet hij gewoon niet wat je wil.
1 2 3 4 | * { margin: 0; padding: 0; } |
Wel of niet gebruiken van een reset is onderdeel van discussie (ik ben zelf pertinent tegen), maar op deze manier is niemand voorstander eigenlijk. Je CSS wordt er megatraag van doordat je zo álle elementen selecteert, plus je verneukt een heleboel default stijl die gewoon hardstikke prettig is.quote:Op maandag 14 november 2011 21:50 schreef boem-dikkie het volgende:
Ik zet altijd in mijn stylesheets:
[ code verwijderd ]
Weet niet of dat netjes is maar het werkt wel.
Dan tieft hij alles op nul tot ik het anders zeg.
de universele selector (asterisk) wordt o.a. door Google afgeraden omdat dit aanzienlijk meer rendertijd kost dan een lijst met alle elementen.quote:Op maandag 14 november 2011 21:50 schreef boem-dikkie het volgende:
Ik zet altijd in mijn stylesheets:
[ code verwijderd ]
Weet niet of dat netjes is maar het werkt wel.
Dan tieft hij alles op nul tot ik het anders zeg.
Als je een reset eenmaal gewend bent kan je veel sneller bereiken wat je wilt en hoef je minder om te kijken naar onderlinge renderglitches. Met name voor mobiele sites waar een klein verschil veel uit kan maken vind ik het onmisbaar gewordenquote:Op maandag 14 november 2011 21:55 schreef KomtTijd... het volgende:
[..]
Wel of niet gebruiken van een reset is onderdeel van discussie (ik ben zelf pertinent tegen), maar op deze manier is niemand voorstander eigenlijk. Je CSS wordt er megatraag van doordat je zo álle elementen selecteert, plus je verneukt een heleboel default stijl die gewoon hardstikke prettig is.
Behalve misschien voor een menu, maar daar defineer ik toch altijd wel zelf de margins voor, dus dan zou ik die reset weer overschrijven en is'ie ook nutteloos.
Gewoon met float?quote:Op maandag 14 november 2011 22:40 schreef Dimens het volgende:
Nu even iets anders.
Ik wil aan de rechterkant van het menu een div hebben waar ik tekst in kan plaatsen. Helaas weet ik niet hoe zoiets moet als je geen position gebruikt. De div zet hij nu namelijk onder het menu, dat is niet de bedoeling.
Ik had hier laatst ook al een discussie over waar ik op een gegeven moment maar mee gestopt ben omdat er toch geen einde aan komt dus ik ga er nu ook niet al te veel woorden aan vuil maken. Maar in mijn ogen is de standaard browserstijl nog steeds vooral nuttig, voornamelijk voor je content gedeelte. Als je klakkeloos alle styles reset, zul je ook voor alle elementen zelf weer een stijl moeten toevoegen, zodat ze niet helemaal verneukt zijn mocht iemand ze ooit gebruiken in de content. Voor elementen waar je die standaard stijl niet op wilt (een h1, h2 enz misschien), wil je 9 van die 10 keer toch wel zelf een margin e.d. instellen dus dan heeft resetten ook geen nut. En het zelfde geldt voor template elementen.quote:Op maandag 14 november 2011 22:12 schreef n8n het volgende:
[..]
Als je een reset eenmaal gewend bent kan je veel sneller bereiken wat je wilt en hoef je minder om te kijken naar onderlinge renderglitches. Met name voor mobiele sites waar een klein verschil veel uit kan maken vind ik het onmisbaar geworden
Ik had het gekopieerd uit mijn vorige css en daar stond de margin-left nog op 140px. Toen paste het niet meer en heeft hij hem op de volgende regel gezet. Beetje stom van mijzelf, maar het is nu gelukt.quote:Op maandag 14 november 2011 23:05 schreef KomtTijd... het volgende:
weet je wel zeker dat ze naast elkaar passen dan? inclusief borders, margins en margins? (die worden bij de breedte opgeteld, google op "css box model")
Ik sluit me hier bij aanquote:Op maandag 14 november 2011 22:50 schreef KomtTijd... het volgende:
[..]
Gewoon met float?
[..]
Ik had hier laatst ook al een discussie over waar ik op een gegeven moment maar mee gestopt ben omdat er toch geen einde aan komt dus ik ga er nu ook niet al te veel woorden aan vuil maken. Maar in mijn ogen is de standaard browserstijl nog steeds vooral nuttig, voornamelijk voor je content gedeelte. Als je klakkeloos alle styles reset, zul je ook voor alle elementen zelf weer een stijl moeten toevoegen, zodat ze niet helemaal verneukt zijn mocht iemand ze ooit gebruiken in de content. Voor elementen waar je die standaard stijl niet op wilt (een h1, h2 enz misschien), wil je 9 van die 10 keer toch wel zelf een margin e.d. instellen dus dan heeft resetten ook geen nut. En het zelfde geldt voor template elementen.
Met een reset verneuk je dus de "fallback" voor elementen die je op het eerste gezicht niet gebruikt, en voor elementen die je wel veel gebruikt voegt het eigenlijk niets toe.
Maargoed, niet iedereen is het daar mee eens, dus ik ga er verder dan dit ook niet meer over discussiëren.
bottom: 0;quote:Op dinsdag 15 november 2011 09:01 schreef Dimens het volgende:
Hoe zet je eigenlijk een mooie footer aan het einde van je pagina?
Een die automatisch aan de onderkant van je browser komt en als je browser langer wordt, dat deze dan automatisch naar onder gaat.
Ik ben aan het zoeken, maar misschien heeft iemand een tip.
dan zit deze altijd aan de onderkant van de viewport, ook als de content groter is?quote:
Heb m'n content altijd op min-height:100% dan drukt hij hem gewoon naar beneden als ik veel content heb.quote:Op dinsdag 15 november 2011 09:07 schreef n8n het volgende:
[..]
dan zit deze altijd aan de onderkant van de viewport, ook als de content groter is?
ok interessant, kom nog uit de tijd dat het alleen werkte met een absoluut of gefixeerd gepositioneerd elementquote:Op dinsdag 15 november 2011 09:10 schreef boem-dikkie het volgende:
[..]
Heb m'n content altijd op min-height:100% dan drukt hij hem gewoon naar beneden als ik veel content heb.
Die tijd leven we nog steeds in hoorquote:Op dinsdag 15 november 2011 09:13 schreef n8n het volgende:
ok interessant, kom nog uit de tijd dat het alleen werkte met een absoluut of gefixeerd gepositioneerd element
Bij mij niet, ik begin nooit aan position: absolute e.d. daar heb ik echt altijd ruzie.quote:Op dinsdag 15 november 2011 09:19 schreef QM84 het volgende:
[..]
Die tijd leven we nog steeds in hoor
Een bottom: 0 met een position static doet evenveel als een bottom 60059237658783786px
Maw: die bottom 0 is leuk, maar overbodigzonder werkt het ook.
Voor alle zekerheid: Wss staat er nog een position: absolute bij.
In dat geval, raad ik je dit artikel aan. Legt met voorbeelden op een simpele manier uit hoe positioning precies werkt en wat je van je browser mag verwachten als je er mee gaat zitten rommelen.quote:Op dinsdag 15 november 2011 09:33 schreef boem-dikkie het volgende:
[..]
Bij mij niet, ik begin nooit aan position: absolute e.d. daar heb ik echt altijd ruzie.
Het grootste nadeel van een absoluut gepositioneerd element, is dat deze niet meer automatisch een hoogte krijgt die meetelt in 'de flow' van de pagina. Als je dus meerdere absoluut gepositioneerde elementen hebt, schalen deze niet mooi mee met de content van de pagina, zoals Catch22- hierboven ook al aanhaalt.quote:Op dinsdag 15 november 2011 10:27 schreef Tijn het volgende:
Waarom wordt er zo'n fuss gemaakt over position: absolute? Ik gebruik het regelmatig... wat is het probleem?
Werkt goed, die css regel kende ik nog niet.quote:
Erg handig, heeft mij meteen geholpen met het volgende waar ik niet uit kwam. Dat was het toevoegen van een plaatje bij de tekst en deze rechts van de tekst plaatsen.quote:Op dinsdag 15 november 2011 11:37 schreef Catch22- het volgende:
http://www.alistapart.com/articles/css-floats-101/handig artikel om even te lezen
Ik heb er inderdaad een margin bij gedaan, gewoon simpel 10px aangezien dat al voldoende is en er goed uit ziet.quote:Op dinsdag 15 november 2011 11:50 schreef Catch22- het volgende:
en nog een margin:0 0 5px 5px; erbij natuurlijk
Volgens mij moet je ook je html en/of body een height van 100% geven, anders werkt het niet. Als je googled op "100% height css" of "sticky footer css" zijn er genoeg voorbeelden te vinden in ieder geval.quote:Op dinsdag 15 november 2011 09:16 schreef boem-dikkie het volgende:
Ik heb mijn content op min-height: 800px staan, en de height op 100%. En dan de footer op bottom: 0;
't is meer dat het een veelgemaakte beginnersfout (/cheapass-wysiwyg-sitebuilder-fout) is om alle elementen domweg met position:absolute naar hun plaats te schuiven, om vervolgens erachter te komen dat de elementen niet meer meeschalen met hun content en de helft van je site buiten beeld staat zonder scrollbalk bij iemand die zijn browser niet fullscreen heeft. Waar men dan weer de meest creatieve oplossingen voor probeert te vinden zonder het fundamentele probleem aan te pakken: Je site heeft geen flow.quote:Op dinsdag 15 november 2011 10:41 schreef Tijn het volgende:
Duidelijk. Ik gebruik het ook niet zoveel voor content, maar meer voor een header of een speciaal blok ofzo die de rest van de site niet in de weg moet zitten. Maar ik ben nooit echt tegen browserissues aangelopen dat ik me kan herinneren, het werkt eigenlijk altijd wel zoals ik verwacht dat het werkt.
een margin rechts met float right zorgt er wel voor dat je afbeelding rechts niet mooi uitlijnt met je content.quote:Op dinsdag 15 november 2011 12:05 schreef Dimens het volgende:
[..]
Ik heb er inderdaad een margin bij gedaan, gewoon simpel 10px aangezien dat al voldoende is en er goed uit ziet.
In dit geval wel, daar waar de tekst eindigt, eindigt ook het plaatje. Hij staat nu echt perfect, in elke browser ook.quote:Op dinsdag 15 november 2011 12:32 schreef Catch22- het volgende:
[..]
een margin rechts met float right zorgt er wel voor dat je afbeelding rechts niet mooi uitlijnt met je content.
En zodra je meer tekst hebt?quote:Op dinsdag 15 november 2011 12:39 schreef Dimens het volgende:
[..]
In dit geval wel, daar waar de tekst eindigt, eindigt ook het plaatje. Hij staat nu echt perfect, in elke browser ook.
Ja ook.quote:
Ik zou hem relatief positioneren en iets naar linksboven schuiven.quote:Op woensdag 16 november 2011 11:39 schreef TheSeeker_NL het volgende:
Ik merk dat ik moeite heb de juiste aanpak te vinden voor het positioneren.
Ik wil begrijpen hoe je een icoon naast een header kan positioneren. Hij zou gedeeltelijk buiten de div moeten vallen zoals hieronder:
[ afbeelding ]
Het gaat mij om die "pagina" icoon links boven.
Ik begrijp niet wat hiervoor de juiste aanpak is. Met position:absolute en een z-idex die hoger is zou je zo'n icoon daar kunnen plaatsen volgens mij, maar het lijkt nogal omslachtig als je 10 van die iconen hebt of als er iets aan de afmetingen van het ontwerp veranderd. Het lijkt me dat er een betere oplossing is. Kan iemand mij de goede richting op sturen?
1 2 3 4 5 6 7 8 9 10 11 12 | #contact h2 { background:#555; text-align:right; color:white; padding-right:15px; } #contact .icon { margin-top:20px; margin-left:-13px; float:left; } |
1 2 3 4 5 6 7 8 9 10 | <div id="contact"> <img class="icon" src="images/contact_icon.png" /> <h2>Contact</h2> <address> Straat<br /> Plaats<br /> Telefoon<br /> Fax<br /> <a href="">email@email.com</a> </address> |
In dit geval is dat de beste oplossing inderdaad.quote:Op woensdag 16 november 2011 12:52 schreef Catch22- het volgende:
Ik zou #contact een position:relative geven en die afbeelding een absolute, dan zit hij je flow niet in de weg.
Ah dat was net het probleem waar ik mee aan het stoeien was. Fijn dat het opgelost, vrij irritant.quote:Op woensdag 16 november 2011 12:52 schreef Catch22- het volgende:
Ik zou #contact een position:relative geven en die afbeelding een absolute, dan zit hij je flow niet in de weg.
Ook erg mooi dat fancybox, alleen niet precies wat ik zoek. Ik zoek er een die ik neerzet en die automatisch naar de volgende foto toe gaat met een fade transition.quote:Op woensdag 16 november 2011 13:42 schreef Catch22- het volgende:
fancybox en een beetje zelf scripten?
Je zoekt eigenlijk een soort galleryviewer? Daar zijn echt een miljoenmiljard plugins voor
Geweldig! Dit beantwoord alles inderdaad.quote:Op woensdag 16 november 2011 13:14 schreef Catch22- het volgende:
http://www.alistapart.com/articles/css-floats-101/
http://www.alistapart.com/articles/css-positioning-101/
neem die eens door, dan moet je het wel snappen.
Precies de punten waar ik zelf ook iets aan wilde doen. Vooral de links, niet goed leesbaar en daar probeer ik nog het goede contrast voor te vinden.quote:Op donderdag 17 november 2011 01:33 schreef Tijn het volgende:
Ik ben zeker geen grafisch vormgever, maar ik vind het wel wat hebben. Het is in elk geval duidelijk en dat is wat mij betreft het belangrijkste.
Wat me wel opvalt:
- het lettertype oogt wat formeel of ouderwets in mijn ogen en past niet zo goed bij het verdere design (ik zou denk ik eerder iets zonder schreef kiezen)
- het kleurcontrast tussen de links in het verticale navigatiemenu en de achtergrond is niet groot genoeg, waardoor het best moeilijk te lezen is (zeker die onderste)
Misschien een witte text-shadow?quote:Op donderdag 17 november 2011 01:50 schreef Dimens het volgende:
[..]
Precies de punten waar ik zelf ook iets aan wilde doen. Vooral de links, niet goed leesbaar en daar probeer ik nog het goede contrast voor te vinden.
1 2 3 4 5 6 7 8 9 10 | img { opacity:1.0; filter:alpha(opacity=100); /* For IE8 and earlier */ } img:hover { opacity:0.6; filter:alpha(opacity=60); /* For IE8 and earlier */ } |
1 2 3 4 5 6 7 8 9 10 | img { opacity:1.0; filter:alpha(opacity=100); /* For IE8 and earlier */ } img.hover:hover { opacity:0.6; filter:alpha(opacity=60); /* For IE8 and earlier */ } |
1 | <img src="mijn_epic_plaatje.png" class="hover" alt="check die hover dan" /> |
Ik vind het een beetje 2001-ish. Maar goed, ik ben ook geen designer gelukkig.quote:Op donderdag 17 november 2011 01:27 schreef Dimens het volgende:
[ afbeelding ]
Ziet dit er een beetje goed uit voor een website.
Het menu zit links en wanneer een van die pagina's gekozen is, dan wordt die dezelfde kleur als het tekstveld. Zeg maar dit:
[ afbeelding ]
Natuurlijk komt daar waar Dimens staat, mijn eigen naam te staan. En zal het menu nog aangepast worden met de elementen die ik op mijn website wil hebben staan.
PM Dimens, die zat kortgeleden in ongeveer hetzelfde schuitje volgens mij, weet niet hoe hij dat uiteindelijk heeft opgelost.quote:Op donderdag 17 november 2011 09:59 schreef McCandless het volgende:
Ik heb op dit moment eigenlijk 0 kennis van HTML en CSS, maar wil me de kennis graag eigen maken. Hoeveel tijd zou het ongeveer kosten voor ik echt een fatsoenlijke website kan maken? Probleem is namelijk dat ik er eigenlijk alleen in de avonduren en weekenden aan kan werken.
Defineer "echt een fatsoenlijke website"quote:Op donderdag 17 november 2011 09:59 schreef McCandless het volgende:
Ik heb op dit moment eigenlijk 0 kennis van HTML en CSS, maar wil me de kennis graag eigen maken. Hoeveel tijd zou het ongeveer kosten voor ik echt een fatsoenlijke website kan maken? Probleem is namelijk dat ik er eigenlijk alleen in de avonduren en weekenden aan kan werken.
Ik haat de site, maar w3schools legt de basis wel uit. Ga dan gewoon klooien met layouts, maak een menu, maar voor mijn part een standaardsiteje op en als je iets niet snapt ga je googlen en op AListApart.com kijken.quote:Op donderdag 17 november 2011 09:59 schreef McCandless het volgende:
Ik heb op dit moment eigenlijk 0 kennis van HTML en CSS, maar wil me de kennis graag eigen maken. Hoeveel tijd zou het ongeveer kosten voor ik echt een fatsoenlijke website kan maken? Probleem is namelijk dat ik er eigenlijk alleen in de avonduren en weekenden aan kan werken.
Ik heb tutorials van Thenewboston bekeken en meteen nagedaan. Alles heb ik toen opgeslagen onder de naam van waar de tutorial over ging. Als ik het nu even niet snap, dan pak ik weer het stukje erbij van die tutorial en dan snap ik het weer.quote:Op donderdag 17 november 2011 09:59 schreef McCandless het volgende:
Ik heb op dit moment eigenlijk 0 kennis van HTML en CSS, maar wil me de kennis graag eigen maken. Hoeveel tijd zou het ongeveer kosten voor ik echt een fatsoenlijke website kan maken? Probleem is namelijk dat ik er eigenlijk alleen in de avonduren en weekenden aan kan werken.
Wordpress is vooral geschikt voor als je niet te veel moeite wilt doen, lekker makkelijk een template downloaden, logo aanpassen en klaar.quote:Op donderdag 17 november 2011 10:31 schreef McCandless het volgende:
Een fatsoenlijke website is inderdaad een breed begrip. Het is in eerste instantie een hobbyproject. Ik ben nu voor mijn werk veel bezig met begrippen als SEO en SEA. Om dit verder uit te bouwen lijkt het me goed om zelf ook een (mooie) zoekmachinevriendelijke website te kunnen bouwen. Wie weet wat er dan verder ooit nog uit rolt..
Is het met WordPress ook gewoon mogelijk een eigen indeling aan je site te geven? Ik zit er ook over te denken om te gaan bloggen bijvoorbeeld, het zal wel erg ingewikkeld zijn om zoiets zelf te gaan bouwen in HTML? Aangezien je de artikelen dan ook wilt archiveren en relevante andere artikelen bij je laatste posts wilt laten zien, etc.
Merci! Ga ik vanavond eens downloaden! Ik zag je website hier al voorbij komen, hoeveel tijd heb je er ongeveer aan besteed tot nu toe?quote:Op donderdag 17 november 2011 10:30 schreef Dimens het volgende:
[..]
Ik heb tutorials van Thenewboston bekeken en meteen nagedaan. Alles heb ik toen opgeslagen onder de naam van waar de tutorial over ging. Als ik het nu even niet snap, dan pak ik weer het stukje erbij van die tutorial en dan snap ik het weer.![]()
Er is ook een torrent download van, heb ik zelf gebruikt omdat dit makkelijker was.
Ik wil er inderdaad best wat moeite voor doen. Heb ook goede verhalen gehoord over Drupal, begreep dat hier ook meer mogelijkheden mee zijn dan Wordpress, dus wellicht dat ik daar ook nog eens naar ga kijken.quote:Op donderdag 17 november 2011 10:36 schreef KomtTijd... het volgende:
[..]
Wordpress is vooral geschikt voor als je niet te veel moeite wilt doen, lekker makkelijk een template downloaden, logo aanpassen en klaar.
Als je echt from scratch een HTML-pagina wilt maken zijn er veel betere CMS's te krijgen, kijk bijvoorbeeld naar CMS Made Simple ofzo.
enigzins onzin, je kan in Wordpress namelijk ALLES zelf regelen qua weergave.quote:Op donderdag 17 november 2011 10:36 schreef KomtTijd... het volgende:
[..]
Wordpress is vooral geschikt voor als je niet te veel moeite wilt doen, lekker makkelijk een template downloaden, logo aanpassen en klaar.
Als je echt from scratch een HTML-pagina wilt maken zijn er veel betere CMS's te krijgen, kijk bijvoorbeeld naar CMS Made Simple ofzo.
Toch vind ik niet dat het is om een site mee te bouwen. Persoonlijk. Leuk voor blogs, verder vind ik het minder.quote:Op donderdag 17 november 2011 10:42 schreef Catch22- het volgende:
[..]
enigzins onzin, je kan in Wordpress namelijk ALLES zelf regelen qua weergave.
Drupal heeft een minder userfriendly backend/beheer
Ik voel er zelf ook meer voor om zelf alle code en dergelijke te programmeren, een blog is namelijk slechts een onderdeel van de site.quote:Op donderdag 17 november 2011 10:45 schreef RenRen- het volgende:
[..]
Toch vind ik niet dat het is om een site mee te bouwen. Persoonlijk. Leuk voor blogs, verder vind ik het minder.
Als je het goed inricht kan je er echt alles mee hoor...quote:Op donderdag 17 november 2011 10:45 schreef RenRen- het volgende:
[..]
Toch vind ik niet dat het is om een site mee te bouwen. Persoonlijk. Leuk voor blogs, verder vind ik het minder.
Dat moet je helemaal niet willen, maar daar kom je wel achter.quote:Op donderdag 17 november 2011 10:51 schreef McCandless het volgende:
[..]
Ik voel er zelf ook meer voor om zelf alle code en dergelijke te programmeren, een blog is namelijk slechts een onderdeel van de site.
Forum Opties | |
---|---|
Forumhop: | |
Hop naar: |