Konstigt float-problem (css)

2003-10-08 14:57

#1

scooterbabe
Medlem ●
International user
2003-10-08 14:57

Hej!

Har en liten loginsida som jag skulle fixa om från tabell till css:ad layout, men float verkar inte fungera så bra i IE (5 mac), eller så gör jag något annat fel...

Kod:
<http://tosti.dk/victor/logintest.html>

IE (fel):
<http://tosti.dk/victor/ie.gif>

Safari (korrekt):
<http://tosti.dk/victor/safari.gif>

Antar att det har att göra med någon bugg i IE's box-modell, men hur kommer jag runt detta?

Anmäl Ändra Gilla Svara

2003-10-08 16:32

#2

HL
Medlem ●
Stockholm
2003-10-08 16:32

Testa att göra login_box lite bredare, eller formulärfälten lite smalare. Du kan också testa med att ge div.left en fast bredd. Har märkt att IE ofta måste ha det.

Anmäl Ändra Gilla Svara

2003-10-08 19:35

#3

Danne V
Medlem ●
Karlstad
2003-10-08 19:35

Min kunskap om layouter helt i CSS är LÄTT begränsad, men jag undrar om t.ex. detta kan vara riktigt?

<div class="row">
<div class="left">
<span class="broed">
Brugernavn: <br />
<input type="text" size="20" class="broedform" name="user" />
</span>
</div>

Du har två div-stilar på varandra och därefter en span-klass, men bara en </div> och en </span>. Borde det inte vara TVÅ </div>?

Dessutom undrar jag om inte "in-line" klasser (dvs span) "ärver" attribut från en del outline-stilar, och om inte din andra <div> "ärver" attribut från den första?

Sist: är det OK att köra BÅDE </blahbla> OCH <blahbla /> som closing tags i samma dokument?

CSS kommer nog att bli en aning lättare vad det lider...

Senast redigerat 2003-10-08 19:50

Anmäl Ändra Gilla Svara

2003-10-08 19:48

#4

Mattias Hedman
Medlem ●
Sundsvall
2003-10-08 19:48

Varför inte köra med tabeller som de var tänkta från början? Som spalt indelare.

Alltså:

För table finns med i XHTML så utnyttja den mer...
Tittade på koden och den såg väldigt nästad ut!
Intebehöver du både span och id taggar.
Gör ett css med klassen "nåt" och definera typsnitt och sånt där i.
Så bygger jag numera. Smidigt som fan!

Kan verkligen rekommedera Jeffrey Zeldmans bok "Designing with Web Standards". Länk till boken...

Anmäl Ändra Gilla Svara

2003-10-08 19:51

#5

scooterbabe
Medlem ●
International user
2003-10-08 19:51

Citat:

Skrevs ursprungligen av Danne V
Min kunskap om layouter helt i CSS är LÄTT begränsad, men jag undrar om t.ex. detta kan vara riktigt?

<div class="row">
<div class="left">
<span class="broed">
Brugernavn: <br />
<input type="text" size="20" class="broedform" name="user" />
</span>
</div>

Du har två div-stilar på varandra och därefter en span-klass, men bara en </div> och en </span>. Borde det inte vara TVÅ </div>?

Koden fortsätter med:

<div class="left">
<span class="broed">
Brugerkode: <br />
<input type="password" name="pass" size="20" class="broedform" />
</span>
</div>
</div>

Citat:

Dessutom undrar jag om inte "in-line" klasser (dvs span) "ärver" attribut från en del ouline-stilar, och om inte din andra <div> "ärver" attribut från den första?

Jo, ifall man inte explicit sätter de till något annat...

Citat:

Sist: är det OK att köra BÅDE </blahbla> OCH <blahbla /> som closing tags i samma dokument?

För att koden skall vara xhtml-compliant måste den följa regelverket för xml. Detta säger att de taggar som inte har en sluttag, t ex <img> eller <input> skall skrivas som <img></img> alternativt <img /> för att signalera att taggen slutar. Annars uppfattar en xml-parser den som ej stängd och signalerar fel.

Anmäl Ändra Gilla Svara

2003-10-08 19:54

#6

johan dansk
Medlem ●
2003-10-08 19:54

hinner tyvärr bara med att säga att ie5/mac's boxmodell minst sagt suger, isär vad gäller floating elements :/

har mer än en gång förbannat den pga av detta..

Anmäl Ändra Gilla Svara

2003-10-08 20:05

#7

scooterbabe
Medlem ●
International user
2003-10-08 20:05

Citat:

Skrevs ursprungligen av Mattias Hedman
Varför inte köra med tabeller som de var tänkta från början? Som spalt indelare.

Alltså:

För table finns med i XHTML så utnyttja den mer...
Tittade på koden och den såg väldigt nästad ut!
Intebehöver du både span och id taggar.
Gör ett css med klassen "nåt" och definera typsnitt och sånt där i.
Så bygger jag numera. Smidigt som fan!

Kan verkligen rekommedera Jeffrey Zeldmans bok "Designing with Web Standards". Länk till boken...

Skall kolla in boken - kan vara bra att ha annan referens än webben...

Vad gäller tabeller har jag viss allergi mot dem, och skulle vilja att det fungerade i IE som det fungerar i bl a Safari. Jag vet att jag har gett upp någon gång tidigare på en annan sida med att få floats att fungera i IE, men eftersom det skall gå så begår jag säkert "bara" något grundläggande fel som borde gå att fixa.

Anmäl Ändra Gilla Svara

2003-10-08 20:11

#8

Danne V
Medlem ●
Karlstad
2003-10-08 20:11

Jo, jag tittade närmare och hittade den förlorade </div>.

En väldigt bar källa för CSS-diskussioner och problem är newsgroupen för CSS hos www.projectseven.com.

Du kan bara koppla upp dig med en newsreader. Adressen är forums.projectseven.com och gruppen heter (väldigt träffande) "css".

Där finns bl.a. Al Sparber och CSS gurun Eric Meyer...

Anmäl Ändra Gilla Svara

2003-10-08 20:20

#9

scooterbabe
Medlem ●
International user
2003-10-08 20:20

Ok - tips på newsreader? Testade genom alla på VT en gång bara för att konstatera att samtliga utom... Entourage *ryyyys* sög elefantballe...

Anmäl Ändra Gilla Svara

2003-10-08 20:24

#10

scooterbabe
Medlem ●
International user
2003-10-08 20:24

Citat:

Skrevs ursprungligen av Mattias Hedman
</div>
Kan verkligen rekommedera Jeffrey Zeldmans bok "Designing with Web Standards". Länk till boken...

Är det förresten samma Zeldman (hur många kan det finnas) som skriver på A list apart? Då rusar jag nog och köper den meddetsamma!

Vad gäller tables är väl de avsedda för tabellformaterad data och inte för layout i xhtml och html4?

Anmäl Ändra Gilla Svara

2003-10-08 20:26

#11

Danne V
Medlem ●
Karlstad
2003-10-08 20:26

Utan jämförelse Mozilla Thunderbird:
http://texturizer.net/thunderbird/

Anmäl Ändra Gilla Svara

2003-10-08 20:29

#12

Danne V
Medlem ●
Karlstad
2003-10-08 20:29

Citat:

Skrevs ursprungligen av scooterbabe
Vad gäller tables är väl de avsedda för tabellformaterad data och inte för layout i xhtml och html4?

Jo, dom var skapta för tabellformaterad data en gång i tiden, men används mest i layout numera.
Och: Exakt VAD är tabellformaterad data? Det bestämmer man väl själv.

Anmäl Ändra Gilla Svara

2003-10-08 20:57

#13

scooterbabe
Medlem ●
International user
2003-10-08 20:57

Citat:

Skrevs ursprungligen av Danne V
Utan jämförelse Mozilla Thunderbird:
http://texturizer.net/thunderbird/

Danke!

Anmäl Ändra Gilla Svara

2003-10-08 21:02

#14

scooterbabe
Medlem ●
International user
2003-10-08 21:02

Citat:

Skrevs ursprungligen av Danne V
Jo, dom var skapta för tabellformaterad data en gång i tiden, men används mest i layout numera.
Och: Exakt VAD är tabellformaterad data? Det bestämmer man väl själv.

Citerar w3.org :

Citat:

Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.

Så det finns inget uttryckligt förbud mot det men en tämligen stark avrådan.

Detta är nog viktigare för webbutvecklare på andra sidan atlanten då de riskerar att bli stämda om inte sidorna kan läsas av hjälpmedel för handikappade; för oss här handlar det snarare om en samvetsfråga då handikappsvänliga sidor sällan efterfrågas av kunderna.

Därmed inte sagt att inte jag anser man bör avhålla sig från att bygga upp layout m h a tables

Anmäl Ändra Gilla Svara

2003-10-08 21:19

#15

Danne V
Medlem ●
Karlstad
2003-10-08 21:19

Citat:

Skrevs ursprungligen av scooterbabe
Citerar w3.org :

Så det finns inget uttryckligt förbud mot det men en tämligen stark avrådan.

Detta är nog viktigare för webbutvecklare på andra sidan atlanten då de riskerar att bli stämda om inte sidorna kan läsas av hjälpmedel för handikappade; för oss här handlar det snarare om en samvetsfråga då handikappsvänliga sidor sällan efterfrågas av kunderna.

Därmed inte sagt att inte jag anser man bör avhålla sig från att bygga upp layout m h a tables

Ah! W3C svamlar i ett j-gt lömskt försök att får folk att bygga sidor med en teknik dom anser vara "rätta vägen". Lynx och andra läsare för handikappade klarar innehåll i tabeller alldeles utmärkt. Jag har en bekant som är en MYCKET skicklig webdesigner (framförallt CSS) vars dotter har kraftigt nedsatt syn. Hon har aldrig haft minsta problem med tabeller.

Däremot kan jag köpa argumentet att div's ger avsevärt mindre kod, vilket kan spara en hel del bandbredd.

Whatever. Men sparka igång Thunderbirden och kolla PVII's newsgroup. Dom är ju fortfarande på jobbet därborta, så ge dom dina URL, så får du säkert hjälp inom en halvtimme.

Anmäl Ändra Gilla Svara

2003-10-08 21:28

#16

scooterbabe
Medlem ●
International user
2003-10-08 21:28

Inte sparkat igång ännu men löst felet!

Stötte på sidan Internet Explorer 5 Mac: oddities där mitt problem finns med under sektionen "Miscellaneous float bugs
".

Problemet hade som vi misstänkte med ärvning att göra - IE ärver felaktigt clear-attributet, så genom att helt enkelt ta bort det från min div-klass "row" (som klassen på bug-sidan också heter :rolleyes: ) fixar det sig.

Fast jag ser fram mot Zeldmans bok ändå Han är extremt underhållande att läsa.

<http://www.tosti.dk/victor/logintest.html>

Anmäl Ändra Gilla Svara

2003-10-13 22:42

#17

scooterbabe
Medlem ●
International user
2003-10-13 22:42

Då har den kommit, boken. Beställde i torsdags från engelska amazon, idag när jag kom hem från jobbet låg den på hallgolvet!

Fan, jag älskar böcker och jag älskar att beställa böcker från England - så jäkla smidigt. Leveraras på samma tid som inom Sverige till ett lägre pris - 225 SEK inkl Vat och frakt! :eek:

Anmäl Ändra Gilla Svara

2003-10-13 23:57

#18

Adrian B
Medlem ●
Umeå
2003-10-13 23:57

Internet Bookshop i England fungerar lika smidigt. Väldigt trevligt att beställa böcker därifrån.

Anmäl Ändra Gilla Svara

2003-10-14 00:11

#19

scooterbabe
Medlem ●
International user
2003-10-14 00:11

Citat:

Skrevs ursprungligen av Adrian B
Internet Bookshop i England fungerar lika smidigt. Väldigt trevligt att beställa böcker därifrån.

Nämnde det inte men det är mitt absoluta favoritställe! Alla kategorier!

Anmäl Ändra Gilla Svara

2004-04-06 20:57

#21

Danne V
Medlem ●
Karlstad
2004-04-06 20:57

Ursprungligen av Mikael M:

Jag har gjort en knapprad med en enradig tabell och med css. Tabellen har samma bredd som den <div> den ligger inuti. Detta funkar i olika browsers (safari, Mozilla, Opera) men inte i IE. Tolkar IE css-attributet "width" på annat sätt än de andra? Tabellen blir nämligen ca 30 pixlar bredare i IE. Däremot blir <div> i rätt storlek i IE.

Någon som vet?

Överhuvudtaget verkar browsarna ha många olika uppfattningar hur att tolka en table-class.

-mikael

Det räcker om du postar frågan på ETT ställe.
Ladda upp sdian o ge en URL.

Anmäl Ändra Gilla Svara

2004-04-07 07:51

#22

Mikael M
Medlem ●
2004-04-07 07:51

Ursprungligen av Danne V:

Det räcker om du postar frågan på ETT ställe.

thank you for stating the obvious!

Jag upptäckte mitt misstag med en gång och raderade posten i detta forum. Märkligt nog gick det inte.

addendum: Nu lyckades jag radera den. det räcker inte bara att trycka på knappen "delete this message", man måste också klicka i radioknappen "Delete this message". Riktigt lattjo design...

Senast redigerat 2004-04-07 08:01