login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Img als border

Offline kiwi - 23/07/2010 16:46
Avatar van kiwiNieuw lid Beste,

ik zou graag dat een afbeelding de bovenste en onderdste border word van een div,
maar hoe begin ik hier best aan? ik heb het al proberen opzoeken op het internet, maar ik kgraate er niet echt aan uit
dit is de img: http://remotecosmix.webatu.com/images/hdvidder.png (mag in code "images/hdvidder.png" zijn)
welke CSS moet ik hier voor opzetten dat de boven en onderkant van de div die afbeelding hebben?

5 antwoorden

Gesponsorde links
Offline WouterJ - 23/07/2010 17:20
Avatar van WouterJ HTML gevorderde Het wordt iets in de trant van:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. div.top {
  2.  background: url('/images/hdvidder.png') top;
  3. }
  4. div.bottom {
  5.  background: url('/images/hdvidder.png') bottom;
  6. }

En dan een div met daarin een class top en een class bottom.

Met CSS3 (wordt nog niet door IE ondersteunt) kan je 2 backgrounds aan een element geven dus dan kan je dit gewoon in 1 div zetten.
------
Je moet altijd / gebruiken voor een link. Dat betekend vanaf de root. Als je geen / ervoor zet is dat vanaf de map waar je de pagina in hebt staan.
Offline Martijn - 23/07/2010 17:33 (laatste wijziging 23/07/2010 17:35)
Avatar van Martijn Crew PHP ik weet niet of de div zelf een background heeft, anders kun je er een div omheen zetten met margin-topp en margin-bottom op 2px zetten.

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div class="bordered door de margins">
  2.     <div class="deze heeft een eige achtergrond ingestelt,kan ook kleur zijn">
  3.         inhoud
  4.         inhoud
  5.         inhoud
  6.     </div>
  7. </div>


edit: En dan moet je die border div uiteraard de background hebben met repeat-y
Offline kiwi - 23/07/2010 18:03 (laatste wijziging 23/07/2010 19:03)
Avatar van kiwi Nieuw lid
Waldio schreef:
Het wordt iets in de trant van:
[..code..]
En dan een div met daarin een class top en een class bottom.

Met CSS3 (wordt nog niet door IE ondersteunt) kan je 2 backgrounds aan een element geven dus dan kan je dit gewoon in 1 div zetten.
------
Je moet altijd / gebruiken voor een link. Dat betekend vanaf de root. Als je geen / ervoor zet is dat vanaf de map waar je de pagina in hebt staan.


euhm zonder die "/" werkt hij, maar met wertk hij niet, , want het is in de folder, en voor vanaf root moet je "./" doen 

en ik moest je code omvormen naar dit:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. #links_menu.boven {
  2. 	background-image: url("images/hdvidder.png");
  3. 	background-position: bottom left;
  4. 	background-repeat:no-repeat;	
  5. }
  6. #links_menu.onder {
  7. 	background-image: url("images/hdvidder.png");
  8. 	background-position: top left;
  9. 	background-repeat:no-repeat;	
  10. }


en dat was dan de HTML maar hij gaf alleen de bovenste weer
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="links_menu" class="onder" class="boven"> test 1</div>


OPLOSSING:ik heb het maar opgelost met gewoon de <img> tag te gebruiken
maar als iemand de oplossing weet, mag hij het gerust posten, dan weet ik het voor de volgende keer

mvg Kiwi
Offline Martijn - 23/07/2010 19:11
Avatar van Martijn Crew PHP ik gaf net een oplossing. En #links_menu mag je uit je css weghalen, dat voegt helemaal niets toe in deze situatie, maakt je css alleen maar langzamer. Geen zin om uit te leggen waarom 
Offline kiwi - 23/07/2010 20:09 (laatste wijziging 23/07/2010 20:17)
Avatar van kiwi Nieuw lid ja ok, maar ik bedoel echt een border dat een img is, niet mogelijkheden om dit te omzeilen ;D

volgende probleem: http://www.site...2#id241125
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.18s