[CSS]Ambetante padding die niet goed is
Ik ben al druk in de weer geweest met het voorbereiden van mijn nieuwe site. Zonder Paint gedoe :). Waarvoor mijn prestatie. Echter loop ik tegen het volgende probleem. Iedere keer als ik een <br> - <p> of wat dan ook toevoeg krijg ik last van ruimte's die niet weg te krijgen zijn. (weg wel maar niet echt OK)
Dit is de link
http://www.wouter.php-design.be/Nieuwdesign/
Nu zie je dat ik in het menu (links) een blauw vlekje heb.
Ik heb al gezocht om het weg te krijgen maar tevergeefs. Ik moet nog meer ruimte tussen hebben.
Kan iemand me helpen ?
http://www.wouter.php-design.be/Nieuwdesign/css.css
MVG
Scroll even verder, er is een nieuw probleem opgekomen.
Gewijzigd op 01/01/1970 01:00:00 door Wouter K
Misschien is dit iets voor je? http://developer.yahoo.com/yui/reset/
Standaard hebben browsers hun eigen implementatie van margins/paddings, om dit een beetje onder de duim te krijgen kun je, als een van de vele oplossingen, dit reset.css als stylesheet gebruiken.
Grtz.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<style type="text/css">
@import url('css/reset.css');
@import url('css/jou_stylesheet.css');
</style>
<!-- etc! -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<style type="text/css">
@import url('css/reset.css');
@import url('css/jou_stylesheet.css');
</style>
<!-- etc! -->
Ik weet niet zeker of dit een oplossing is voor jouw probleem, maar volgens mij ligt het aan standaard margin/paddings van jouw browser. Dit is een oplossing om dat te kunnen verhelpen.
Iemand soms nog een idee? In geval dit niet werkt.
mvg
Edit:
1. dit ver..... mijn site volledig.
1. dit ver..... mijn site volledig.
Gewijzigd op 01/01/1970 01:00:00 door Wouter K
#logintop {
background:#FFFFFF
}
bij #loginonder haal je alle styles weg.
background: url('logintop.gif');
width: 200px;
height: 30px;
background-color: #FFFFFF;
}
#loginonder{
background: url('loginbottom.gif');
width: 200px;
height: 30px;
background-color: #FFFFFF;
}
Euhm ? Validator erdoor gehaalt of dergelijke Jan ,?
padding: waardepx waardepx waardepx waardepx;
en in plaats van waarde uiteraard de hoeveelheid pixels.
mocht je het niet weten, de eerste waarde is voor boven, dan rechts, dan onder en dan links (klokje rond dus)
hoop dat dit helpt.
en trouwens, je kan je css een stuk opschonen ook. note's toevoegen, algemene opmaak zoals lettertype in body, div ed zetten...
groetjes
<br /> buiten de div "link" hebt miss werkt het als je hem erin zet? of gaat het om dat andere blauwe stuk?
wouter schreef op 22.02.2008 23:28:
#logintop{
background: url('logintop.gif');
width: 200px;
height: 30px;
background-color: #FFFFFF;
}
#loginonder{
background: url('loginbottom.gif');
width: 200px;
height: 30px;
background-color: #FFFFFF;
}
Euhm ? Validator erdoor gehaalt of dergelijke Jan ,?
background: url('logintop.gif');
width: 200px;
height: 30px;
background-color: #FFFFFF;
}
#loginonder{
background: url('loginbottom.gif');
width: 200px;
height: 30px;
background-color: #FFFFFF;
}
Euhm ? Validator erdoor gehaalt of dergelijke Jan ,?
Nee gekopieerd uit de FireBug extensie.
Aanvoeging op Jan. -> Firebug geeft mij toch meer eigenschappen dan de jouwe ?
Nu mijn volgend probleem = In mijn form zie je in IE een groot probleem met margin padding , en ik zou niet weten waar het ligt ?.
Kan iemand me helpen ?
Grtz
http://www.wouter.php-design.be/Nieuwdesign/
http://www.wouter.php-design.be/Nieuwdesign/css.css
Gewijzigd op 01/01/1970 01:00:00 door Wouter K
Edit:
IE zal weer met de line-height liggen te klooien. Probeer maar eens line-height: 12px. Overigens gebruik je nu p tags waar je eigenlijk labels zou moeten gebruiken.
Gewijzigd op 01/01/1970 01:00:00 door Jan Koehoorn
(aan de rest zie PM jan naar mij :p )
@Jan : Ik ben niet vertrouwd met labels.
Gewijzigd op 01/01/1970 01:00:00 door Wouter K
Code (php)
1
2
2
<p class="formlogin">Gebruikersnaam :</p>
<input class="input" type="text" name="Gebruikersnaam" value=""/>
<input class="input" type="text" name="Gebruikersnaam" value=""/>
maar het zou zo moeten:
Code (php)
1
2
3
4
2
3
4
<p class="formlogin">
<label for="gebruikersnaam">Gebruikersnaam :</label>
<input class="input" id="gebruikersnaam" name="gebruikersnaam" type="text" value="" />
</p>
<label for="gebruikersnaam">Gebruikersnaam :</label>
<input class="input" id="gebruikersnaam" name="gebruikersnaam" type="text" value="" />
</p>
Ik heb al 1 ding kunnen goed krijgen dankzij jan.
Dit is het onderste stuk zoals jullie kunnen zien is ok enkel aan de bovenkant van de login is in IE5->7(8) nog steeds een kleine margin.
De site is nog steeds de vinden op.
http://www.wouter.php-design.be/Nieuwdesign/
en de css
http://www.wouter.php-design.be/Nieuwdesign/css.css
Hoop op een spoedig antwoord.
Grtz
Let vooral op de CSS; die kon een stuk simpeler.