login  Naam:   Wachtwoord: 
Registreer je!
 Forum

[css] Probleempje met kaders

Offline MarcN - 30/10/2005 17:17
Avatar van MarcNGrafische interesse Hallo,

Ik ben net begonnen met HTML & CSS maar nu wil ik in het kader tekst hebben, daarom heb ik deze code gekregen:

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <fieldset style="border: 1px solid black;"><legend>title</legend>lsdnflskdnflksndkldks</fielsdet>


Maar, nu wil ik hem in mijn source zetten:

php code - Bekijk de code zonder highlighting - Klap code in 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  2.      "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  3. <html>
  4. <head>
  5. <style type="text/css">
  6. body, html {
  7.     background-color: #CCCCCC;
  8.     padding: 5px;
  9.     margin: 0px;
  10.     text-align: center;
  11. }
  12.  
  13. .context_kop {
  14.     padding-left: 10px;
  15.     padding-right: 10px;
  16.     height: 30px;
  17.     padding-top: 5px;
  18.     margin-top: 10px;
  19.     font-family: "Trebuchet MS", Verdana, Arial, Sans-serif;
  20.     font-size: 24px;
  21.     font-weight: bold;
  22.     color: #006699;
  23. }
  24.  
  25. .context_text {
  26.     border-bottom: 1px #006699 dashed;
  27.     border-top: 1px #006699 dashed;
  28.     font-family: "Bitstream Vera Sans", Verdana, Arial, Sans-serif;
  29.     font-size: 12px;
  30.     padding-top: 10px;
  31.     padding-bottom: 10px;
  32.     padding-left: 20px;
  33.     padding-right: 20px;
  34.     text-align: justify;
  35. }
  36.  
  37. #content {
  38.     background-color: #DDDDDD;
  39.     padding: auto;
  40.     margin: auto;
  41.     width: 680px;
  42.     text-align: left;
  43.     border-top: 1px #006699 solid;
  44.     border-left: 1px #006699 solid;
  45.     border-right: 1px #006699 solid;
  46. }
  47.  
  48. #footer {
  49.     text-align: center;
  50.     padding-top: 5px;
  51.     padding-bottom: 5px;
  52.     border-top: 1px #006699 solid;
  53.     border-bottom: 1px #006699 solid;
  54. }
  55.  
  56. #header_left {
  57.     border-right: 2px #006699 solid;
  58.     width: 100%;
  59.     color: #F60;
  60.     background: #006699;
  61.     padding-top: 3px;
  62.     font-family: Georgia,Times;
  63.     font-size: 54px;
  64.     font-weight: bold;
  65.     line-height: 1em;
  66.     padding-bottom: 5px;
  67. }
  68.  
  69. #header_right {
  70.     font-family: geneva,arial;
  71.     color: #F60;
  72.     font-size: 12px;
  73.     font-weight: bold;
  74.     padding-left: 5px;
  75. }
  76.  
  77. #sub_header {
  78.     border-left: 1px #006699 solid;
  79.     border-right: 1px #006699 solid;
  80.     border-bottom: 1px #006699 solid;
  81.     width:100%;
  82.     background:#F60;
  83.     text-align:center;
  84.     font-size:small;
  85.     font-family:system,geneva;
  86.     font-weight:bold;
  87. }
  88.  
  89. #navAlpha {
  90.        position: absolute;
  91.        width: 150px;
  92.        top: 110px;
  93.        left: 10px;
  94.        border: 1px solid #006699;
  95.        background-color: #eee;
  96.        padding: 10px;
  97.        z-index: 2;
  98.        voice-family: "\"}\"";
  99.        voice-family: inherit;
  100.        width: 115px;
  101. }
  102.  
  103.  
  104. </style>
  105.  
  106. <title>UnlimitedPower.nl</title>
  107.  
  108. </head>
  109. <body>
  110. <div id="header_left"
  111. onclick="top.location.href='http://www.unlimitedpower.nl/';">
  112. <span title="UnlimitedPower.nl"
  113. onmouseover="this.style.color='#006699';"
  114. onmouseout="this.style.color='#F60';">
  115. UnlimitedPower
  116. </span>
  117. <span id="header_right">Bla Bla Bla Bla</span>
  118. </div>
  119. <div id="sub_header">
  120. Welkom dan maar he
  121. </div>
  122. <div id="content">
  123. <div id="navAlpha">
  124. blabalbla
  125. </div>
  126. <div class="context_kop">Lipsum</div>
  127. <div class="context_text"> Lorem ipsum pro sanctus accumsan deterruisset et, ex exerci definiebas vix. Ei his deserunt principes deseruisse, nihil mucius detraxit ut quo. Has euismod mandamus consetetur ut, quo in nulla quidam efficiendi. In eos kasd iudico, graeci feugait ut vim. Quo viris melius erroribus et, ei altera offendit explicari nam. Vim iudico necessitatibus ea.</div>
  128. <br \>
  129. <div id="footer">&copy; 2005, UnlimitedPower.nl, valideer: <a href="http://validator.w3.org/check?uri=referer" title="Gigadesign is valid Xhtml strict 1.0">Xhtml 1.0</a></div>
  130. </div>
  131. </body>
  132. </html>


Maar dat wil me niet lukken om het in CSS te krijgen. Zodat het ook valid is. Ik weet, dat de website niet goed te zien valt in IE, maar dat probeer ik later wel bij te werken. In FF is hij wel goed, en ik verwacht ook dat hij nog niet 100% valid is. Maar, ik heb dus de twee kaders, aan de linker en rechterzijde, en daar wil ik dat dus hebben. Zou iemand me kunnen helpen?

Bedankt!

1 antwoord

Gesponsorde links
Offline Fenrir - 30/10/2005 20:39
Avatar van Fenrir PHP expert Je kunt toch gewoon tekst in een div zetten en dan CSS: border: 2px solid #0000FF ??
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.18s