Toon posts:

html/css problemen

Pagina: 1
Acties:

Verwijderd

Topicstarter
Naar aanleiding van mijn vorige topichttp://gathering.tweakers...message/23354007#23354007. Ben ik toch maar begonnen om de lay out te gaan doen met ccs, zoals dat door veken aangeraden werd. Ik heb hiervoor een soort van ccs template gebruikt, en wat tututials en site's gelezen. Undertussen ben ik al een beetje begonnen aan de lay-out maar loop een klein beetje vast. Ik het hele zooitje graag wat breeder willen hebben! ik heb alle geprobeerd maar krijg het niet voor elkaar.

Dit is de pagina zoals hij er nu na enig uuren kutten uitziethttp://kjappert.kj.funpic.org/droelloe/index.htm

Hier kan je de ccs vinden die ik gebruikt voor de lay outhttp://kjappert.kj.funpic...2c-hd-ft-fixed-layout.css Let vooral nog niet op de kleuren enz daar klopt nog niets van.

Dan kom ik gelijk op mijn volgende vraag: Het menu heb ik gemakt met een stukje software, maar het ziet er in de browser overduidelijk anders uit als iin het programma. Is er een mogelijkheid om ook dit menu met bijv. css te maken, als dit zo is hoe dan.

Alvast bedankt,

[ Voor 4% gewijzigd door Verwijderd op 11-05-2005 20:44 ]


  • Zoefff
  • Registratie: September 2001
  • Laatst online: 06-05 23:07

Zoefff

❤ 

Natuurlijk is dat mogelijk, http://www.naarvoren.nl/artikel/hover.html is precies wat je zoekt en (naast wat gezond verstand) alles wat je nodig hebt :)


FotoblogWerkaandemuur.nlMoestuincursus.nlTwitter


  • AxiMaxi
  • Registratie: December 2000
  • Laatst online: 28-04 16:00
Je bent al je DIV's aan het nesten en je plaatst naast je gelinkte sheet ook nog allerlei style properties in de HTML tags. Nogal rommelig en ongestructureerd. Hier is voor een leek niet uit te komen zonder een uur studeren, schat ik :)

Wat helpt, is je site uitkleden (desnoods met quoting stukken er even 'tussenuit' laten) en dan kijken welke properties invloed hebben op wat je ziet.

Edit: Ey, Zoefff, handig!

[ Voor 7% gewijzigd door AxiMaxi op 11-05-2005 20:55 ]

[Hier had mijn handtekening kunnen staan]


Verwijderd

Topicstarter
AxiMaxi schreef op woensdag 11 mei 2005 @ 20:53:
Je bent al je DIV's aan het nesten en je plaatst naast je gelinkte sheet ook nog allerlei style properties in de HTML tags. Nogal rommelig en ongestructureerd. Hier is voor een leek niet uit te komen zonder een uur studeren, schat ik :)

Wat helpt, is je site uitkleden (desnoods met quoting stukken er even 'tussenuit' laten) en dan kijken welke properties invloed hebben op wat je ziet.
Ik kom er inderdaad niet uit, ik neem aan dat je onder een leek iemand bedoeld die er niet veel verstand van heeft. Ik neem aan dat je met die extra properties de lettertypes, grootes,kleuren bedoeld, die zou ik idd weg kunnen halen. Maar ik ben bang dat ik het hele zooitje dan nog steeds niet breeder krijg. Met de quoting stukken doel je neem ik aan op de informatie tekst die erop staat, die had ik er alleen even snel opgezet om een iets makkelijkere indruk te krijgen.

Op de breedte na aanpassen kom ik redelijk uit de properties van de pagina en de ccs. Alleen dat verbreeden van de complete bende lukt nog niet.

edit: en wat bedoel je precies met het nesten van de div's?

[ Voor 4% gewijzigd door Verwijderd op 11-05-2005 21:02 ]


  • bat266
  • Registratie: Februari 2004
  • Laatst online: 07:57
Allereerst complimenten dat je zo snel je site anders wilt opzetten, meeste mensen denken het werkt toch, waarom zou ik t veranderen.
Ten tweede ik heb even je source code bekeken en merkte dat je daar nog
code:
1
<ul style=....>

etc hebt staan. De bedoeling is nu om alles wat te maken heeft met de weergave dus te verplaatsen naar de stylesheet.
Het nesten van divs betekend:
code:
1
2
3
4
<div id='1'>
  <div id='2'></div>
  <div id='3'></div>
<div>

hiermee is het mogelijk om complexe layouts te maken als je hierbij hulp nodig hebt voeg maar toe at msn
edit:

mvvenrooij[at]hotmail[dot]com

[ Voor 255% gewijzigd door bat266 op 12-05-2005 07:28 ]

Better to remain silent and be thought a fool then to speak out and remove all doubt.


Verwijderd

Topicstarter
Oke ik heb je sowiso toegevoegd, dus dat komt goed. Ik ga probeeren om het nog wat aan te passen zodat je dus niet meer die lay out dingen in de html pagina hebt staan.

Verwijderd

Topicstarter
wat ik nu alleen nog niet weet, en waar ik deze topic uiteindelijk om begon is hoe ik de site breeder kan maken. Ik vindt hem nu iets te smal, en de rand die eromheen zit, dus eigenlijk de achtergrond te groot. En hoe pas ik die nou aan???

  • bolleh
  • Registratie: Juli 2001
  • Laatst online: 22:25
Verwijderd schreef op vrijdag 13 mei 2005 @ 11:46:
wat ik nu alleen nog niet weet, en waar ik deze topic uiteindelijk om begon is hoe ik de site breeder kan maken. Ik vindt hem nu iets te smal, en de rand die eromheen zit, dus eigenlijk de achtergrond te groot. En hoe pas ik die nou aan???
de grootste div die ik kon vinden in de css is 650px breed...zoek daar eens op en speel ermee :)
wees vooral niet bang iets te slopen, meestal maak ik mn websites ook door gewoon dingen uit te proberen en kijken wat het effect is, in combinatie uiteraard met google en w3schools.com ;)

Verwijderd

Topicstarter
oke man, heb ik gedaan en ik ben nu weer een stap verder, ik ga gewoon rustoig door en dan zien we het wel, in ieder geval bedankt voor de tip :)

Verwijderd

Topicstarter
Ik het content kader wat ik ga gebruiken om alles tekst en informatie in te zetten, zou ik graag een achtergrond willen hebben. Ik heb een achtergrond gemaakt en opgeslagen in de map images. Nu wil ik in mijn ccs code die schtergrond oproepen in het contentkader, ik doe daqt met deze code:

#contentkolom {
background-image: url(../images/bg.JPG); background-attachment: scroll;
border:0px solid #000000;
width:490px;
height:760px;
background:#ffffff;
color: #333333;
text-align:center;
}

Er gebeurd allen niets, ik heb alles geupload naar http://kjappert.kj.funpic.org/droelloe/index3.htm. Zoals je ziet geen achergrond, terwijl die tog egt wel op de server staat, namelijk hier http://kjappert.kj.funpic.org/droelloe/images/bg.JPG

Heeft iemand enig idee hoe dit kan, mischien gebruik ik niet de goeie code ofz.

  • André
  • Registratie: Maart 2002
  • Laatst online: 06-05 11:13

André

Analytics dude

Haal de ../ eens weg uit die url ;)

Verwijderd

Topicstarter
eeh oke heb ik gedaan nu staat er dit:

#contentkolom {
background-image: url(images/bg.JPG); background-attachment: scroll;
border:0px solid #000000;
width:490px;
height:760px;
background:#ffffff;
color: #333333;
text-align:center;
}


Maar nog steeds geen achtergrond plaatje??
Kijk maar zelfhttp://kjappert.kj.funpic.org/droelloe/index3.htm

  • rb338
  • Registratie: Januari 2001
  • Laatst online: 04-03 19:38
edit:
Geblaat weggehaald, was even in de war :+

edit2:
Dan toch even iets...

border:0px solid #000000;

Waarom? Als je die hele regel wegsmijt krijg je hetzelfd effect.
En ik denk dat background: #ffffff je background-image overruled oid, probeer die eens weg te halen (of boven background-image te zetten, of gewoon:
background: white url(blaat.jpg) scroll;

Totaalplaatje dus:
Cascading Stylesheet:
1
2
3
4
5
6
7
#contentkolom {
background: white url(images/bg.JPG) scroll;
width:490px;
height:760px;
color: #333333;
text-align:center;
}

[ Voor 255% gewijzigd door rb338 op 13-05-2005 15:42 ]


  • André
  • Registratie: Maart 2002
  • Laatst online: 06-05 11:13

André

Analytics dude

En als je de volledige url in je CSS zet?
http://kjappert.kj.funpic.org/droelloe/images/bg.JPG
rb338 schreef op vrijdag 13 mei 2005 @ 15:25:
edit:

Is het niet gewoon
code:
1
background: url(blaat.jpg);

En dus niet background-image?

Dit soort dingen zijn toch echt niet ingewikkeld...
In background kun je alle 'settings' kwijt en in background-image alleen de url, beide manieren kunnen prima.

[ Voor 67% gewijzigd door André op 13-05-2005 15:28 ]


Verwijderd

Topicstarter
Het is gelukt, bedankt, ik denk tog idd dat die bachground color moellijk deed.

Verwijderd

Topicstarter
Zow daar ben ik weer :D

Heb weer een probleem, ik heb in het linker kader een plaatje toegevoegd. Nu zou ik dat plaatje graag wat meer naar beneden willen hebben. Ziehttp://kjappert.kj.funpic.org/droelloe/index3.htm. Kan ik dit instellen in de ccs of moet ik dat anders doen. Ik heb al geprobeerd om aan de <img> tag valign="middle" toe te voegen maar dat haalt weinig uit.

Nu heb ik nog een probleem, Dat plaatje wat geladen moet worden heet loc.jpg, ik heb dit plaatje gemaakt in photoshop en geupload, er is alleen iets heel raars mee. Het staat wel op de server,
zie http://kjappert.kj.funpic.org/droelloe/images, maar wordt steeds niet weergegeven, ik heb het plaatje al 4 keer onieuw op de server gezet, en al 3 verschillende namen gegeven maar het werkt niet. Als ik dan een ander plaatje upload wordt ie wel weer gegeven. Heeft iemad een idee hoe dit kan.

Alvast bedankt!

  • rb338
  • Registratie: Januari 2001
  • Laatst online: 04-03 19:38
Ik stel voor dat je gewoon even zelf gaat knutselen, want align="middle" in je img-tag is bullshit en je geeft bovenaan de pagina weer dat je XHTML gebruikt, maar je sluit je img-tag niet.

Zulke problemen ZIJN gewoon niet moeilijk. En dat je dan plaatjes opnieuw gaat uploaden is vergeefse moeite, want dat zal wel gewoon werken. Kijk eens gewoon goed naar je code, of de box waarin je img staat bijvoorbeeld niet te breed is. Zet desnoods een border om je div's heen.

edit: En als ik in Firefox je plaatje wil openen krijg ik:
The image "http://kjappert.kj.funpic.org/droelloe/images/loc.jpg" cannot be displayed, because it contains errors.

Het lijkt dus toch aan je plaatje te liggen. Maar opnieuw uploaden gaat dat iig niet oplossen.

edit2: Untitled-2.jpg en locatierhoon.jpg doen 't ook niet. Ligt duidelijk aan jouw plaatjes...

[ Voor 34% gewijzigd door rb338 op 15-05-2005 13:24 ]


Verwijderd

Topicstarter
jaah klopt, die anderere 2 plaatjes zijn dezelfde foto, alleen met een andere naam. Ik begrijp dus ook wel dat het aan de plaatjes ligt, mijnvraag was alleen of iemand een idee had wat dat zou kunnen zijn, want ik heb dat idee namelijk niet.

edit: Ik heb het plaatje nu werkend, was het was geen id. Ik heb hem nu voor het web opgeslagen in photoshop, ik denk dus dat ht daar aanlag. Ik ga zelf nog wel ff klooten om dat plaatje in het midden te krijgen

Ehh nog even over dat niet afluiten van die img tags, hoe zou ik dat moeten doen dan? Ik heb even gekeken op http://www.w3.org/TR/xhtml11/ maar kom er niet egt uit. Mischien weet je waar ik het kan vinden?

[ Voor 51% gewijzigd door Verwijderd op 15-05-2005 14:12 ]


  • rb338
  • Registratie: Januari 2001
  • Laatst online: 04-03 19:38
Heb het plaatje net opgeslagen en geopend met paint shop pro 9, dat ging goed. Heb hem geëxporteerd en geüpload naar mijn webspace, probeer die eens:
edit: linkje weer weg

[ Voor 11% gewijzigd door rb338 op 15-05-2005 14:25 ]


  • Wacky
  • Registratie: Januari 2000
  • Laatst online: 28-04 21:25

Wacky

Dr. Lektroluv \o/

Positioneren van je background image doe je ook dmv CSS:

http://www.w3schools.com/css/pr_background-position.asp (zie x-pos / y-pos gedeelte)

Nu ook met Flickr account


Verwijderd

Topicstarter
Wacky schreef op zondag 15 mei 2005 @ 14:10:
Positioneren van je background image doe je ook dmv CSS:

http://www.w3schools.com/css/pr_background-position.asp (zie x-pos / y-pos gedeelte)
Ik heb even gekeken op die site, staan veel leerzame dingen op trouwens, maar eeh hij doet het niet egt, als ik jou link volg zie ik niet meer dan de banner.
Geen id of dit aan ligt of niet??

hij doet het nu!

Ik heb het gelezen en zoiets zou ik idd moeten gebruiken, dit plaatje is alleen geen achtergrond. Kan dit zelfde ook met een gewoon plaatje??

[ Voor 17% gewijzigd door Verwijderd op 15-05-2005 14:18 ]


  • SSH
  • Registratie: Januari 2004
  • Niet online

SSH

. . . . . . . .


  • rb338
  • Registratie: Januari 2001
  • Laatst online: 04-03 19:38
Gewoon standaard guidelines van xhtml, dat afsluiten. Gebruik anders gewoon HTML 4.01 als doctype, want blijkbaar heb je geen idee wat xhtml inhoudt :D

Voor de volledigheid: <x> tags die geen </x> hebben (zoals [img]""[/img]

Verwijderd

Topicstarter
Klopt het gaat ook om index3.htm


Om nog even terug te komen op het niet afsluiten van de tags, ik probeer het te leren en weet er idd dus nog niet zo veel vanaf. Ik ga de tags vanaf nu goed afsluiten. ;)

Verwijderd

Topicstarter
Ik was nu eigenlijk van plan om deze code te gaan gebruiken voor het uitlijjen van mij plaatje

p
{
position: absolute;
top: 200px;
left: 100px
}

Is dit mogelijk, want ze gebruiken het hier voor tekst, ik heb de code toegepast in mijn ccs maar de foto blijft op dezelfde plaats staan.

Dit is de code die ik nu gebruik:

img.locatie
{
height: 300px;
width: 150px
position: absolute;
top: 600px;
left: 0px;
}

Oke de code kan ik gebruiken zolang ik de position code maaar boven de hoogt en breedte code laat staan.

[ Voor 32% gewijzigd door Verwijderd op 15-05-2005 15:17 ]


Verwijderd

Topicstarter
Ik ben erachter gekomen dat dat uitlijnen met die pixels niet gaat werken, ik moet toch een andere manier gaan gebruiken. Iemand een tip?

Verwijderd

Als je het plaatje niet als achtergrond hebt dan gaat dat toch gewoon via
Cascading Stylesheet:
1
text-align: center;


Met
Cascading Stylesheet:
1
2
top: 600px;
left: 0px;
komt die dus ergens linksonder in het beeld te staan. Misschien dat left: 50%; ook werkt.. dat weet ik niet.

  • AxiMaxi
  • Registratie: December 2000
  • Laatst online: 28-04 16:00
Verwijderd schreef op woensdag 11 mei 2005 @ 21:01:
Ik kom er inderdaad niet uit, ik neem aan dat je onder een leek iemand bedoeld die er niet veel verstand van heeft.
Nee, ik bedoelde eigenlijk iemand die de code zelf niet gemaakt heeft en dus niet thuis is in de structuur.
Ik neem aan dat je met die extra properties de lettertypes, grootes,kleuren bedoeld, die zou ik idd weg kunnen halen. Maar ik ben bang dat ik het hele zooitje dan nog steeds niet breeder krijg.
Als je het niet probeert, weet je het niet...
Met de quoting stukken doel je neem ik aan op de informatie tekst die erop staat, die had ik er alleen even snel opgezet om een iets makkelijkere indruk te krijgen.
Nee, ik bedoel dat je in je code dingen moet 'weg quoten'. Dat will zeggen dat je /* en */ voor en na het stukje zet dat je even niet uitgevoerd wilt hebben. Zo kan je zonder iets weg te halen toch iets niet uit laten voeren.

code:
1
2
3
4
5
6
7
8
9
10
11
body {
 background: #ffffff;

 /* hier even niks mee doen

 font: normal normal 8pt/10pt "arial", sans-serif;

 en alles wat hierna komt weer wel gebruiken */

 text-align: center;
}
edit: en wat bedoel je precies met het nesten van de div's?
code:
1
2
3
<div id="blah">
 <div id="hopla"> text </div>
</div>


DIV "hopla" is genest binnen de DIV "blah".

[Hier had mijn handtekening kunnen staan]

Pagina: 1