problemen met css <i> <a>

Status
Niet open voor verdere reacties.

uaejeroen

Terugkerende gebruiker
Lid geworden
7 dec 2009
Berichten
1.665
namelijk: In de ene div werkt het perfect, de link zijn niet cursief
En in de andere div wel?
In die andere div wil ik namelijk de tekst wel <i> en de links niet
Ok heb ik nog een vraag over a:active
Namelijk: als iemand op de link klikt wil ik niet dat die paars wordt dus heb ik dat aangegeven welke kleur het wel moet worden
Maar hij wordt nog steeds paars als ik de link aanklik?

Kan iemand me helpen
 
Idealiter zouden we toch wel even de exacte html en/of csss willen zien die je hebt gebruikt.
Een oordeel over jouw poging wordt nu een beetje moeilijk.


Ik zou me voor kunnen stellen dat dit goed gaat:
<p><i>schuine tekst</i><a href="http://www.example.com">www.example.com</a><i>nog meer schuine tekst</i></p>

Met betrekking tot het vormgeven van links, heb ik hier een leestip voor je:
http://www.handleidinghtml.nl/html/hyperlinks/hyperlinks11.html

Hint:
voor hyperlinks moet je vier verschillende weergaves rekening houden:
a:link
a:visited
a:hover
a:active
en wel in die volgorde (als je ze in een stylesheet vorm gaat geven).
 
wat ik volkomen onbegrijpelijk vind is dat de site er in DW er perfect uitziet, en online ziet het er heel anders uit

Bijv de afmetingen van text field zijn online veel anders dan in Dreamweaver

Hier komen de codes
 
codes

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>


<script src="javascript/index.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>EnergyNet Home</title>
<link href="stylesheet/basic.css" rel="stylesheet" type="text/css" />
<style type="text/css"></style>
<base target="_self" />
<script src="index.js" type="text/javascript"></script>
<script src="index2.js" type="text/javascript"></script>
</head>



<body>
<div id="container">
  <div id="apDiv1"><img src="afbeeldingen/logo_energynet.gif" width="868" height="111" alt="Home" /></div>
<div id="apDiv2">
  <UL STYLE="list-style-type: square; list-style-image: url(afbeeldingen/vink.gif);">
  <li><a href="algemene_informatie.html">Algemene informatie</a><br />
  <a href="tarieven.html">Tarieven</a>
  <a href="pakketen.html"><br />
      Pakketten</a><br />
     </li>
  <li><a href="html/service.html?">Service en onderhoud</a><br />
  <a href="energyservice.html">EnergyService</a><br />
    <a href="html/product.html">Productadvies</a><br />
    <a href="html/besparingtips.html">Besparingstips</a><br />
  </li>
  <li><a href="html/vraagentwoord.html">Vraag en antwoord<br />
    </a>
    <a href="html/mail.html">Per e-mail</a><a href="html/chat.html"><br />
      Via chat</a><br />
  </li>
  <li><a href="html/gegevens.html">Uw gegevens</a><br />
    <a href="html/nota.html">Nota en verbruik</a><br />
    <a href="html/meterstanden.html">Meterstanden doorgeven</a><br />
    <a href="html/verhuizing_doorgeven.html">Verhuizing doorgeven</a></li><br />
</ul>
</div>
<div id="apDiv3">
  <p><img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/verhuizing_doorgeven.html">Verhuizen, wat nu?</a><br /> 
    <img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/besparingtips.html">Besparingstips<br />
      </a>
    <img src="afbeeldingen/vink.gif" width="15" height="16" /><a href="html/klantenservice.html">Klantenservice<br />
    </a><br />
    </p>
  <form id="form1" name="form1" method="post" action="">
      <p>
      <label for="email"></label>e-mail adress<br />
<input name="email" type="text" id="email" size="20" />
      <br />
      wachtwoord<br />
      <label for="password"></label>
      <input name="password" type="password" id="password" size=" 20" />
      <br />
    </p>
    <p align="right"><a href="html/succesvol_ingelogd.html"><img src="afbeeldingen/inloggen01.gif" alt="inloggen" width="77" height="28" hspace="10" align="right" /><br />
      <br />
    </a><a href="html/wachtwoord_aanvragen.html">Wachtwoord aanvragen</a><br />
</p>
</form>
  <p><em>
  
  
  <a href="html/foutmelding_inlog.html">
    Foutmelding inloggen</a></em></p>
</form>
</div>
<div id="apDiv4">

    <p><strong style="font-size:15px;">Welkom bij de Online HelpDesk van EnergyNet</strong><strong style="font-size:15px;"><br />
    </strong></p>
    <p><strong style="font-size:12px;" >U vraagt, wij antwoorden
      </strong><br />
      <br />
      Op deze Online HelpDesk kunt u vragen  stellen omtrent de<br />
      tarieven en de pakketten die wij aanbieden.<br />
      <strong style="font-size:12px;"><br />
      Beheer uw eigen gegevens</strong><strong></strong><br />
      <br />
      Wilt u op de hoogte blijven van uw  verbruik, uw nota inzien, een verhuizing of de meterstanden doorgeven? Dat kan  met uw eigen e-mailadres en wachtwoord. Als u nieuw bent, vult u eenmalig een<br />
      <font color="#FF00FF"><a style="text-decoration:underline" href="html/register formulier.html">registratieformulier</a> </font>in.
      
    </p>
</div>

</div>
</body>
</html>

Code:
@charset "utf-8";
body {
text-align: center;
}
#container {
	text-align: left;
	width: 780px;
	position: relative;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	height: 685px;
} 
 
 



.text {
	text-align: left;
	font-style: normal;
}
.text {
	text-align: left;
}
.text {
	text-align: left;
}
.Title {
	text-align: left;
}
.tekst {
	text-align: left;
}
a:link {
	color: #F0F;
	font-size: 12px;
	text-decoration: none;
	font-style: normal;
}

a:visited {
	color: #666;
}
a:hover {
	font-style: italic;
	color: #22FF22;
    }
a:focus {
	font-style: italic;
	color: #90F;
	font-size: 12px;
    }
	a:active{
	color: #F0F;
	text-decoration: none;
	font-style: normal;
	}
.e-mail {
	color: #696969;
}

#apDiv2 {background: #ffffff;}
#apDiv2 {
	position: absolute;
	left:-1px;
	top:119px;
	width:183px;
	height:559px;
	z-index:2;
	font-size: 12px;
	
}


#apDiv3 {background: #ffffff;}
#apDiv3 {
	position:absolute;
	left:681px;
	top:119px;
	width:183px;
	height:559px;
	z-index:3;
	font-style: normal;


	}

#apDiv4 {background: #ffffff;} #apDiv4 {
	position:absolute;
	left:184px;
	top:120px;
	width:494px;
	height:559px;
	z-index:4;
	color: #000;
	text-decoration: none;
}

.Waarschuwing {
}
.Waarschuwing {
}

#Waarschuwing {
	font-family: "Arial Black", Gadget, sans-serif;
}
#Waarschuwing {
	font-family: "Arial Black", Gadget, sans-serif;
}

.background {
	background-image: url(/afbeeldingen/groen-wit.gif);
	background-repeat: repeat;
}
#apDiv3 #form1 {
	color: #F0F;
}
#apDiv3 #form1 {
	color: #90F;
	font-style: italic;
}


body {
	background-image: url(../afbeeldingen/groen-wit.gif);
	background-repeat: repeat;
	background-position: center bottom;
	font-family: Arial, Helvetica, sans-serif;
	color: #F0F;
}
#container #apDiv3 p {
	color: #000;

}
#container #apDiv3 p em {
	color: #000;
	font-style: normal;
}
#container #apDiv4 #form2 p label {
	color: #F0F;
}
.meter {
	color: #F0F;
}
#container #apDiv4 {
	font-style: normal;
	font-size: 12px;
}
#container #apDiv4 h3 {
	font-size: 15px;
}
#container #apDiv4 strong {
	font-size: 15px;
}
#container #apDiv4 strong {
	font-size: 15px;
}
#container #apDiv4 p {
	font-size: 12px;
	color: #000;
}
#container #apDiv2 p {
	color: #F0F;
	text-align: left;
}
.aanvragen p strong {
	font-size: 15px;
}
.aanvragen p strong {
	font-size: 15px;
}
.aanvragen p {
	font-size: 12px;
}
#container #apDiv4 #form1 p em {
	color: #F0F;
}
#container #apDiv3 p {
	text-align: left;
	font-style: italic;
}
#container #apDiv3 p {
	text-align: left;
}
 * {
	 ul {
	color: #000;  
	list-style-type: none;
	line-height: 1.5em;

}
ul {
	color: #000;  
	list-style-type: none;
	line-height: 1.5em;
	
}



  
#container #apDiv3 #form1 p {
	color: #F0F;
	font-style: italic;
}
#container #apDiv3 #form2 p {
	color: #F0F;
	font-style: normal;
}

#container #apDiv4 p strong {
	font-size: 15px;
	ul .vink
	{
   list-style-image: url(afbeeldingen/vink.gif);
	}
#container #apDiv3 p img {
	font-style: italic;
}


nogmaals wil ik vermelden dat:

de linker DIV is perfect met links niet onderstreept en niet <i>
maar div drie, de rechter is fout

ik heb namelijk aangegeven de tekst is cursief <i> en de links moeten net als alle anderen links niet <i> en niet underline


in DW ziet het er allemaal perfect uit maar online zit het nog vol fouten

Hoe krijg ik die links niet <i> en de tekst / e-mail adres en wachtwoord wel?
 
maar div drie, de rechter is fout
ik heb namelijk aangegeven de tekst is cursief <i> en de links moeten net als alle anderen links niet <i> en niet underline

Div drie (apDiv3) bestaat uit een P, een Form en nog een P.
In de eerste P staan je links "Verhuizen", "Besparingstips" en "Klantenservice"
voor de rest staat er helemaal geen tekst in die P. De vraag is dan ook waarom je aan die P de rule "font-style: italic" hebt gegeven. Er is (buiten de links) helemaal niets om schuin neer te zetten.

De styling van je links wordt overruled door de styling van je P

Zonder P (of P zonder 'italic') staan de link-teksten wel netjes overeind.
 
Ik zag dat er erg veel onnodige css codes waren die geeneen invloed meer hadden...
ik probeer het vandaag wel weer verder hartelijk dank
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan