login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Tekst om afbeelding uitlijen. (Opgelost)

Offline rolandt - 11/12/2007 22:59
Avatar van rolandtNieuw lid Zit al de hele avond te prutsen om met behulp van css style tekst rechts en onder een afbeelding te krijgen. Ondertussen is mijn inspiratie op.

Daarnaast viel mij het op dat resultaat heel anders weer geven wordt in FF en IE. Waar kan dit nou weer aan liggen?

HTML code;
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="hoofd_box">
  2. <div id="left_box">
  3. </div>
  4. <div id="right_box"><!-- Hierin komt de webpagina te staan -->
  5. 	<div class="head">euismod tincidunt</div>
  6. 	<div id="boven"></div>
  7. 	<div id="banner01"></div>
  8. 	<div id="midden">
  9. 		<h1>taion ullamcorper suscipit</h1>
  10. 		<img src="overall/background/punt.gif" />
  11. Ut wisi enim ad minim veniam, quis nostrud exerci taion ullamcorper suscipit lobortis nisl ut aliquip ex en com modo consequat. Duis te feugifacilisi per suscipit lobortis nisl ut aliquip ex en com modo consequat.Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore.
  12. 	</div><!-- sluit midden -->
  13. </div><!-- sluit right box -->
  14. </div><!--hoofd box -->


php code - Bekijk de code zonder highlighting - Klap code in 
  1. div#hoofd_box {
  2. 	margin:0 auto 0 auto; 
  3. 	width:975px; 
  4. 	text-align:center
  5. 	}
  6.  
  7. div#left_box {
  8. 	background-color:red; 
  9. 	padding-top:100px; 
  10. 	float:left; 
  11. 	width: 20%; 
  12. 	height:auto; 
  13. 	text-align:left
  14. 	}
  15.  
  16. div#right_box {
  17. 	background-color: 
  18. 	green;float:left; 
  19. 	width:80%; 
  20. 	height:auto
  21. 	}
  22.  
  23. #boven {
  24. 	background:url(../background/Boven.gif) no-repeat;    
  25. 	width:765px; 
  26. 	height:35px
  27. 	}
  28.  
  29. #banner01 {
  30. 	width:765px;
  31. 	height:144px;
  32. 	background-image: url(../../index_nl/Banner02.jpg);
  33. 	background-repeat: repeat-y;
  34. 	}  
  35.  
  36. #midden {
  37. 	background:url(../background/Midden.gif) repeat-y;    
  38. 	width:765px;
  39. 	height:auto
  40. 	}  
  41.  
  42. #onder {
  43. 	background:url(../background/Onder.gif) no-repeat;    
  44. 	width:765px; 
  45. 	height:25px
  46. 	}
  47.  
  48. .head {
  49. 	font-size:xx-large;
  50. 	font-weight:bolder;
  51. 	word-spacing:2px;
  52. 	padding-top:10px;
  53. 	padding-bottom:25px;
  54. 	color: #EBEAFA;
  55. 	letter-spacing: 1px
  56. 	}
  57.  
  58. h1 {
  59. 	font-size:large; 
  60. 	font-weight:bolder; 
  61. 	word-spacing:2px; 
  62. 	padding-top:25px
  63. 	}


Groet,
Roland.

4 antwoorden

Gesponsorde links
Offline Vincjenzo - 12/12/2007 11:54
Avatar van Vincjenzo Nieuw lid Hey Roland,

Heb even wat zitten klussen voor je.

Plaatscode: 4436
Offline rolandt - 12/12/2007 13:44 (laatste wijziging 12/12/2007 13:45)
Avatar van rolandt Nieuw lid Dankje Vincjenzo.
Heb het gisteren na een paar uur het ook opnieuw geprobeerd. Het lukt mij opeens toen ook. Na het bestuderen van jouw codes heb ik het een en ander aangepast. Zoals de padding en margin heb ik in de body op 0px gezet. Volgens mij neemt dit mij ook nog al eens bij de poot.

Ik vraag mij af hoe jij de inhoud (eigenlijke webtekst) zo mooi uitgelijnd heb gekregen. Dit maakt het lezen van de html bron code een stuk overzichtelijker.
Ik krijg het niet voor elkaar (werk met dreamweaver). Ik neem aan dat jij dit niet doet met alleen maar allemaal spaties geven?

Wat ik mij ook al de hele tijd af vraag, is wat het verchil in gebruik is tussen background {url .......} en background-image {url ....}.
Beide geven bij mij het zelfde resultaat. Alleen de notatie wijze van background {url ....} vindt ik prettiger en overzichtelijker.

Groet,
Roland.
Offline Vincjenzo - 12/12/2007 14:52 (laatste wijziging 12/12/2007 14:53)
Avatar van Vincjenzo Nieuw lid
Citaat:
Ik vraag mij af hoe jij de inhoud (eigenlijke webtekst) zo mooi uitgelijnd heb gekregen. Dit maakt het lezen van de html bron code een stuk overzichtelijker.
Ik krijg het niet voor elkaar (werk met dreamweaver). Ik neem aan dat jij dit niet doet met alleen maar allemaal spaties geven?


Niet met spaties, met tabs. Ik werk ook met Dreamweaver. Je kan de grote van tabs ook instellen. In het algemene menu, met file edit etc, naar Edit >Preferences ... (Ctrl + U) Onder Code Format kan je dan instellen hoeveel spaties een tab bevat.

Echter het is nog maar de vraag of het allemaal uitlijnt als je code op plaatscode zet.

Citaat:
Wat ik mij ook al de hele tijd af vraag, is wat het verchil in gebruik is tussen background {url .......} en background-image {url ....}.

Background: is een verkorte manier om achtergrond eigenschappen te bepalen.

Net zoiets als
border: 1px solid black; een korte manier is om te zeggen:
border-top: 1px solid black;
border-right: 1px solid black;
border-bottom: 1px solid black;
border-left: 1px solid black;

Succes met je site, ik neem aan dat ik hier de vooruitgang kan bekijken?

Vincent
Offline rolandt - 12/12/2007 19:32
Avatar van rolandt Nieuw lid   Het betere graaf werk. Hoewel slecht werk van athome natuurlijk. Maar het antwoord is NEE.
Dit was een eerste aanzet daar toe. Zeg maar mijn kweektuintje.
Wanneer je hiervan de bron code bekijkt zul je zien dat het vol staat met tabellen. Lekker onoverzichtelijk dus om wat te veranderen.
Wil het nu in een nieuw jasje steken met behulp van css style en php. Waarschijnlijk zal de inhoudt er heel anders uit komen te zien. Dit was toch een beetje te hoog gegrepen.

Ik wist zelf niet eens meer dat het er nog op stond. 

Groet,
Roland.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.2s