10 svar · 437 visningar · startad av web00132
Kolla här:
http://member.webforum.nu/2027/
Jag vill alltså att min vita border-right på produkter/informations-divarna ska ligga ovanpå den svarta bordern i diven under som heter leftcolumn. Det funkar finfint i FF men i IE så tenderar min vita border lägga sig innanför, till vänster, om den svarta. Jag pillade lite med z-index och absolut positionering men lyckades inte få till det. Hur göra? :q
#produkter { margin: 220px -1px 0px 20px;
padding: 0px;
width: 180px;
background-color: #ffffff;
border-right: 2px solid white;
border-top: 1px solid black;
border-left: 1px solid black;
border-bottom: 1px solid black;
position: relative;
}{
kanske?
Det ser ut så här:
http://member.webforum.nu/2027/test.html
Tack, men det funkade inte riktigt tyvärr. Mer förslag?
Strulet är lite också att diven 'information' måste vara 'relative' eftersom diven 'produkter' kan ändra storlek på höjden. Annars skulle det kanske gå att göra absolute-positionering på båda divarna och sätta z-index. Men borde det inte gå att få till något med z-index ändå? :OO
Jag kollade nu och det ska fungera. Men du måste nog välja en Doctype... Jag hade xhtml strict och det funkade...
Aha, sorry. Nu funkar det lite bättre, men det saknas två pixlar nertill i produkter-diven i IE:
http://member.webforum.nu/2027/ie.gif
Och det har lagts till två pixlar för mycket i FF på samma ställe:
http://member.webforum.nu/2027/ff.gif
Blir det inte så för dig?
Edit. Jag lade upp samma kod fast med doctype här:
http://member.webforum.nu/2027/test.html
Någonstans på webben finns det hur de olika webläsarna ritar ut border var de ritar första punkten och vart den går över med sitt streck. Men nu kommer jag inte ihåg vart. Om du testar med fyra olika färger runt en box och jämför så ser du hur de gör. Jag tror inte det går att göra någonting åt det, utan är nog något man får leva med.
Ok, tack iaf! :bire
Hmm..
Om du vill kan du luta dig på ett CSS-hack och olika position:relative för olika webbläsare för att få det att funka i MSIE och FireFox ivf...
http://member.webforum.nu/2241/webb00132test.html
KOden är verifierad empiriskt i i MSIE6 och Firefox 1.5 på XP - men Opera 8.5 verkar gå en egen väg och lägga en pixel extra bara i underkantsramens högerkant så där blir det annorlunda... :)
Som tanten sa - Att border hanteras lite olika är nog något man får leva med tyvärr... :birp
jarvklo skrev:
Hmm..
Om du vill kan du luta dig på ett CSS-hack ...
Har ju lagt alla hack åt sidan så länge så jag glömde den lösningen... men måste fråga dig... är det inte bättre då att skriva den i en egen fil för IE6, annars så blir det väl lite pannkaka med IE7 och att web00132 behåller sin ursprungliga kod. Eller tänker jag helt fel? :OO
Tack Jarvklo för att du spårade in mig på filter... :bire
Gjorde som jag tänkte med att lägga in dem i egen fil, efter att ha hittat den här länken om Conditional Comments och är nu väldigt nyfiken på hur Opera, befinlig IE7 och andra än IE6 Och FF ser bordern... här är den med iefil
Border kan ju vara så knepigt att få till i så många sammanhang så det vore kul att veta.
Hmm...
Conditional comments är nog mer "safe" eftersom MS har uttalat att de kommer att fortsätta stödja dem även framöver (Conditional comments är ju som bekant en helt MSIE-specifik teknik) - medan man egentligen inte vet vart ett "CSS-hack" eller "filter" tar vägen i framtida utgåvor av olika webbläsare eftersom de uteslutande bygger på att man medvetet utnyttjar kända buggar för att få det man vill...
Men just "* html"-hacket (med målet att ge specifika ändringar av detaljer i CSS för MSIE6 och tidigare) verkar funka som förväntat för en hel del situationer än så länge iaf :)
PS
I Opera blir den understa pixeln i höger-kanten svart och den översta vit - vilket ger samma "grafiska obalans" som tidigare - i de övriga 2 ser det OK ut (har dock ingen IE7 att testa med härhemma - så den får gärna någon annan rapportera om :) )
