Denna delen av 99 uppdateras inte längre utan har arkiverats inför framtiden som ett museum.
Här kan du läsa mer om varför.
Mac-nyheter hittar du på Macradion.com och forumet hittar du via Applebubblan.

Jobbig border som inte vill försvinna

Tråden skapades och har fått 11 svar. Det senaste inlägget skrevs .
1
Skriv svar
#1
  • Medlem ●
  • Trollhättan
  • 2007-12-11 13:53

Hej!

Nu har jag suttit och pillat med den här satans bordern en bra stund, men hittar ingen lösning att få bort den. Det är en border både i firefox och IE, men den är större i FF på nåt konstigt sätt. Jag använder mig bara av float-funktionen nu, så divvarna ska väl egentligen vara intill varandra?

Så här ser dom ut:

I IE:

Nu har ja markerat divarna med grönt, så ni ser hur bilderna ligger. Ser ni den svarta bordern? Det blir en border mellan två bilder som ligger ovanpå varann, medans två som ligger bredvid varann är intill varandra, som dom ska vara.

Såhär ser det ut i FF:

... och här är det samma sak; bilderna bredvid varann ligger som dom ska, men bilderna på höjden blir det en border mellan.

Hoppas nån förstår när jag förklarar så här konstigt, men komplexa problem behöver komplexa förklaringar.

Hjälp! \\Dana

Anmäl Ändra Svara
#2

Det låter som om du har fått till någon nedärvd css som ställer till det. Ta bort dina border-attribut ett efter ett för att enklast hitta orsaken. Annars, om du har en massa nestade containers i olika färger så kan det vara något misspass där. Plocka bort attribut ett efter ett för att hitta vad som ställer till det - eller posta din css och ev html här.

Anmäl Ändra Svara
#3

Om du inte redan gjort det, ta hem pluginen Firebug till Firefox. Med den kan du ganska enkelt ta reda på vilka css-regler som påverkar ett element.

Anmäl Ändra Svara
#4
  • Medlem ●
  • Trollhättan
  • 2007-12-12 11:26

Såhär ser min css ut:
body {
text-align:left;
background-image: url("BG_color.jpg");
margin:0;
padding:0;
}
#wrapper{
width: 800px;
margin: 0 auto;

}
#box{
margin: 0 auto;

}
#buttons{
float: left;

}
#left{
float: left;

}
#topborder_off{
float: right;

}
#leftborder_off{
float: left;
margin: 0 auto;

}
#button_off{
float: left;
margin: 0 auto;

}
#rightborder_off{
float: right;
margin: 0 auto;

}
#bottomborder_off{
float: left;
margin: 0 auto;

}

-------------------------------

All margin och padding står ju på 0, så det borde väl vara rätt? Jag testade ta bort all margin och padding, men det blev ingen skillnad.

Anmäl Ändra Svara
#5

Jag blir naturligtvis mycket nyfiken på dina id "topborder_off" m fl - använder du en uppsättning divar för att skapa ramar? Låter ju som en tänkbar källa till problem.

Anmäl Ändra Svara
#6
  • Medlem ●
  • Trollhättan
  • 2007-12-13 13:17

Tack för svaret, ninjamac!

Bilderna heter bara top_border, och left_border, så det är inte det som är konstigt.

Men ja, jag använder en massa divvar till att placera ut bilder.. borde jag inte göra det? Jag använder divvar till det mesta, och det har jag alltid gjort.

Jag är ganska osäker på det mesta som har med webbdesign o göra, så... upplys mig!:)

Anmäl Ändra Svara
#7

Tja, din css ovan gör ju egentligen inte nånting att prata om. I detta läget skulle jag behöva titta på din html för att se vad som egentligen händer.
Huruvida du "borde" använda en massa divvar till allting eller inte kan ju diskuteras - men är knappast någon skada i sig.

Anmäl Ändra Svara
#8
  • Medlem ●
  • Trollhättan
  • 2007-12-17 13:20

Ninja: Här är html-koden:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>

<font size="1">
<font color="#ffffff">
<font face="Verdana">
<title>Dana</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="layout.css" rel="stylesheet" type="text/css" />

<script LANGUAGE="JavaScript">

</script>
<script LANGUAGE="JavaScript1.1">

</script>
</head>
<body>

<div id="wrapper">

<div>
<img src="top.png" alt="banner" height="152" width="800" />
</div>

<div id="left">
<img src="left.png" alt="left" height="872" width="114" />
</div>

<div id="topborder_off">
<img src="topborder_off.png" alt="topborder_off" height="215" width="686"/>
</div>

<div id="leftborder_off">
<img src="leftborder_off.png" alt="leftborder_off" height="657" width="186"/>
</div>

<div id="button_off">
<a href="Page1.htm" onMouseOver="swtch('1','button_off')"
onMouseOut="swtch('0','button_off')"><img name="buton_off" src="button_off.png" border="0"></a>
</div>


<div id="rightborder_off">
<img src="rightborder_off.png" alt="rightborder_off" height="654" width="304"/>
</div>

<div id="bottomborder_off">
<img src="bottomborder_off.png" alt="bottomborder_off" height="461" width="196"/>
</div>

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

Anmäl Ändra Svara
#9

Har kollat på det och hittat problemet.

I och med att du använder floats och bilder inuti divvar så tolkas visst radhöjden in i beräkningen.. antagligen på grund av någon misspass mellan bilder.

Om jag tar bort dina font-taggar uppe i html head. (vad fasen gör de där..??)
och
sätter in
line-height:12px;
i bodytaggen så försvinner problemet.

Minst sagt underligt, men å andra sidan är din kod en smula udda också så du tycks ha snubblat på en samling omständigheter som triggar detta.

Om jag slänger bort allt "onödigt" i koden och bara kör en float på alla bilder så har du en utgångspunkt som kanske säger dig något - jag vet inte, men testa:
(ps, doctype som nedan ger bättre kompabilitet för CSS-baserade layouter)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict...">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Dana</title>
<style type="text/css">
*{margin:0;padding:0;}
body{background-image: url("BG_color.jpg");}
#wrapper{width:800px;margin:0 auto;}
img{float:left;}

</style>
</head>
<body>
<div id="wrapper">
<img src="top.png" alt="banner" height="152" width="800" />
<img src="left.png" alt="left" height="872" width="114" />
<img src="topborder_off.png" alt="topborder_off" height="215" width="686"/>
<img src="leftborder_off.png" alt="leftborder_off" height="657" width="186"/>
<img src="rightborder_off.png" alt="rightborder_off" height="654" width="304"/>
<img src="bottomborder_off.png" alt="bottomborder_off" height="461" width="196"/>
</div>
</body>
</html>

Anmäl Ändra Svara
#10
  • Medlem ●
  • Trollhättan
  • 2007-12-20 16:33

Herregud! Tack som fan! Har suttit på det här problemet i veckor nu.

Tack för din hjälp!:D

Anmäl Ändra Svara
#11

Grymt kul med en sådan respons! Kul att få hjälpa till!

Anmäl Ändra Svara
#12
  • Medlem ●
  • 2007-12-29 21:31

Hej,
Jag är grymt imponerad av att kunna se felaktigheter en kod som ovan!

Mitt problem är att jag inte kan "ladda upp" en sida med följande kod:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transi...">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Frykerud Bilder</title>
<style type="text/css">

</style>
</head>

<body>
<span class="style3"><span class="style6">Foto på byggnader i Frykerud</span><br />
<span class="style5">Klicka på hemmansnamnet för att läsa om ortnamnet och på gårdsnamnet för att se bild och text </span></span>
<br />
</body>
</html>

Den är gjord i Dreamweaver/designläge. (Jag kan inget om koder)
Är det fel någonstans??

Anmäl Ändra Svara
1
Bevaka tråden
Nytt i forumet
Debatterade nyheter
Senaste nytt
2 Hur ser ditt julpynt ut hemma?
0 3 ljusa tips för att hålla inbrottstjuvarna borta – använd smart belysning!
12 Slutet på något gammalt - början på något nytt
5 Rykte: Apple väntas lansera en uppdaterad 27" iMac i början av 2022
22 99mac blir Macradion på en helt ny plattform
1 Macradion: Vi släpper lös kraften tillsammans
0 Apple backar på den nya designen av Safari i macOS Monterey
24 Apple släpper macOS Monterey den 25 oktober
0 HomePod mini kommer i fler färger
91 Apple presenterar MacBook Pro, M1 Pro och M1 Max
4 Apple presenterar tredje generationens AirPods
2 Så här ser du Apples event ikväll
1 Apple Watch Series 7 - är det värt att uppgradera?
0 Macradion: Unleash the MF appstore
7 Detta tror vi att Apple visar upp på eventet
1 Apple förlänger sitt serviceprogram för AirPods Pro
0 Rykte: MacBook Pro har samma leverantör av miniLED-paneler som iPad Pro
3 Apple bjuder in till event den 18 oktober
1 BaseLynx: Modulär laddstation utan gränser
1 Tile håller koll på allt från plånbok till nycklar men saknar en nyckelfunktion
0 Apple överklagar domen för betalning genom tredjepartsutvecklare i App Store
Copyright © 2024. Allt innehåll tillhör Svenska Tekniknyheter AB. Citering är tillåten om källan anges. Vi reserverar oss för eventuella informationsfel.
Om 99, RSS, Kontakta oss, Feedback, Trivselregler, Teknisk information och cookies