[CSS & IE] Ongewenste padding / margins - Softwareontwikkeling

zaterdag 18 maart 2006 16:09

Acties:

Topicstarter

Het gaat over deze site:
http://users.skynet.be/ChAoS/ericson/index.html

Wanneer deze geopend wordt in FF/Opera is er niets aan de hand.
Maar wanneer ik deze open in IE dan zitten er witte pixels tussen de items bij het linker en rechter menu.

de CSS: http://users.skynet.be/ChAoS/ericson/teststyle.css

Wat heb ik al geprobeerd:
- Alle afbeeldingen te vervangen voor andere.
- Alle elementen die errond genest zijn te verwijderen.
beide hebben niets geholpen.

zaterdag 18 maart 2006 16:20

Acties:

Verwijderd

[google=css box model internet explorer]

zaterdag 18 maart 2006 16:47

Acties:

Attixx

Topicstarter

Ik heb de box model hack geprobeert.

#content_home{
border-right: 2px solid #2E62A7;
border-left: 2px solid #2E62A7;
background-image: url(images/green.png);
background-repeat: repeat-y;
padding-left: 155px;
height: 365px;
margin-top: 50px;
width:750px;
voice-family: "\"}\"";
voice-family:inherit;
width:591px;
}

html>body #content_home {
width:591px;
}

Die werkt totaal niet. Hij blijft steeds 591px.

Heb net nog een ander probleem ondekt. Als ik naar IE5 ga kijken is plots mijn volledig sub menu verdwenen en dan zie je ook dat de box model hack niet werkt.

http://users.skynet.be/ChAoS/boxmodelhackfailure.JPG dit is het resultaat in IE5.

zondag 19 maart 2006 17:40

Acties:

Attixx

Topicstarter

Schopje

zondag 19 maart 2006 17:45

Acties:

JHS

Splitting the thaum.

De box model hack is eigenlijk best een lomp systeem omdat IE 6+ het wel goed kan

. Je kan beter een doctype nemen wat IE in standarsmode duwt. Let er dan wel op dat je eventueel voor IE < 6 gewoon een apart stylesheet moet aanmaken met andere waardes om het op te lossen. Een standardsmode doctype:

HTML:

1 2	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

DM!

zondag 19 maart 2006 17:47

Acties:

PsyBelgium

Maar dan heb je het probleem toch nog steeds in IE5?
Ik denk dat hij het zowel in IE5 en IE6 werkend wil krijgen.

[ Voor 38% gewijzigd door PsyBelgium op 19-03-2006 17:48 ]

zondag 19 maart 2006 17:53

Acties:

JHS

Splitting the thaum.

PsyBelgium schreef op zondag 19 maart 2006 @ 17:47:
Maar dan heb je het probleem toch nog steeds in IE5?
Ik denk dat hij het zowel in IE5 en IE6 werkend wil krijgen.

Vandaar dat ik er ook, in het kort geef ik toe, bij vermelde dat het handig is om een ie5fix.css stylesheet met behulp van conditional comments te gebruiken waarin je de discrepanties fixt

.

DM!

zondag 19 maart 2006 18:01

Acties:

Attixx

Topicstarter

Zou liever 1 enkele stylesheet gebruiken voor mijn pagina, moest het niet anders kunnen dan probeer ik het wel eens met die apparte stylesheet voor IE5. Als iemand methode weet voor 1 stylesheet hoor ik het graag.

[ Voor 1% gewijzigd door Attixx op 19-03-2006 18:02 . Reden: typo :) ]

maandag 20 maart 2006 01:58

Acties:

Boelie-Boelie

Attixx schreef op zondag 19 maart 2006 @ 18:01:
Zou liever 1 enkele stylesheet gebruiken voor mijn pagina, moest het niet anders kunnen dan probeer ik het wel eens met die apparte stylesheet voor IE5. Als iemand methode weet voor 1 stylesheet hoor ik het graag.

Het is aan te raden het te doen zoals JHS het aangeeft, want dat voorkomt dat andere browsers extra styling hoeven te downloaden die alleen voor IE5 geldt. Je hoeft overigens geen volledig nieuw stylesheet voor IE5 te maken, alleen die stukjes die afwijken zet je daarin.

Als je het toch in één stylesheet wilt, dan moet je met hacks werken, zoals je reeds hebt gedaan (al is dat wel een erg oude hack). Zie www.positioniseverything.net voor een uitgebreide lijst artikelen over IE-bugs en bijbehorende oplossingen, of www.centricle.com/ref/css/filters/ .

Cogito ergo dubito

maandag 20 maart 2006 04:37

Acties:

BtM909

Watch out Guys...

Hacks wil ik sowieso afraden, aangezien je niet weet in welke versies (lees: IE7) die hacks niet meer werken (of anders reageren omdat ze half gefixed zijn

)

[ Voor 18% gewijzigd door BtM909 op 20-03-2006 04:37 ]

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 23 maart 2006 23:06

Acties:

Attixx

Topicstarter

Ik heb al een heleboel kunnen oplossen maar ik heb nu nog een foutje.

http://users.skynet.be/ChAoS/ericson/index.html als je deze pagina opent in IE6 dan ziet u in het menu markets served en eronder zwarte streepjes. Dat is de afbeelding die wil repeaten. De basis code ( image replacements ) is dezelfde als het menu "products" . De afmetingen van de afbeeldingen zijn correct ingesteld. Begrijp niet hoe dit komt.

vrijdag 24 maart 2006 11:58

Acties:

Verwijderd

Vraagje tussendoor:

Wat voor mouseover methode gebruik je? De jouwnens doet het namelijk wel maar flikkert erg veel. Ik ben zelf bezig een watervaste methode te zoeken/schrijven maar het wil nog niet vlotten met alle eisen die ik eraan stel. Ben nu bezig met Unsorted Lists maar dat heeft ook weer nadelen...

Hoor het graag.

vrijdag 24 maart 2006 16:45

Acties:

Attixx

Topicstarter

Mouseovermethode : Ik gebruik nu image replacements. Dus in CSS schrijf je bijvoorbeeld a:hover. En geef er een background afbeelding mee + de width en height. Je moet ook van de links een bloklevel maken door display: block te gebruiken. Als je naar mijn css code kijkt zie je ze wel staan.

Niemand die mij kan helpen met die het zwarte streepjes probleem in IE6 ?