06. november 2006 - 10:19Der er
19 kommentarer og 2 løsninger
En snak om CSS
Hej Eksperter,
Jeg har altid været vant til at opbygge mine websites i tables. Da jeg skal til at opbygge et større projekt, som skal kan vises på pc, håndholdt, psp, ipod m.v. må jeg nok hellere overveje CSS og XHTML-standarden.
Jeg har ikke den store erfaring i opbygning af websites med layers. Der indgår formentlig noget positioning, og min erfaring siger mig, at det kan give et underligt cross-browser resultat.
Jeg står altså nu overfor den opgave, at opbygge sitet ved hjælp af CSS. Jeg har derfor brug for sparring omkring, hvordan jeg griber tingene an. Jeg har kigget diverse tutorials rundt omkring, men deres eksempler er for simple. Typisk noget med at positionere 2 elementer!
I "table-sprog" skal mit website indeholde følgende:
- 1 række til topgrafik - 1 række til banner - 1 række tip topmenu - 1 række med 2 kolonner (til venstremenu og indhold) - 1 række til adresseoplysninger - 1 række til footer (Webdesign: xxx)
Websitet skal være 960px bred og centreret. Desuden noget baggrundgrafik, som følger de forskellige "rækker".
Kan nogen give hjælp omkring dette?
Jeg skal måske sige, at jeg har mange års erfaring i både HTML og CSS, men har ikke forsøgt dette før.
Kommunerne har digitaliseret indgangen for borgerne. Men bag skærmen håndteres mange arbejdsgange stadig manuelt mellem systemer, mails og organisatoriske siloer.
Du kan købe en artikel herinde (for point) omkring det at droppe tables of bruge CSS.
Du kan evt kigge i andre koder. Kig evt http://geektalk.dk. Den er bygget op i div.
Du kan også gå på google og søge på "tableless design" "drop tables use div" "div instead of tables" "div designs"
Sådan lærte jeg det. :)
Mht, hvordan div sider bygges op. Så skal du først have en wrapper er er ugen om det hele 100% bred. Så positionere du efter dem. (jeg bruger kun rigtig sjælden position: attributen). Og spar IKKE på div. Brug masser af dem.
Mht crossbrowser så findes der IE hacks. Bare søg på google: "IE css hack" og læs lidt om det.
Du kan sagtens kode op i mod XHTML standarden, men den behøves ikke være valid. Min lærer her på webintegrator uddannelsen siger at højst sandsynligt vil 100% valide sider "fucke" op i de forskellige browsers.
2. PageContentLeft og PageContentMiddle er placeret ved siden af hinanden vha. float: left. Men når der er for meget indhold i PageContentMiddle flyder det rundt om PageContentLeft (som jeg har bedt den om!). Hvilken kommando benytter jeg i stedet?
Foreløbig har MS endnu ikke udgivet en browser, der understøtter XHTML - og FF gør det kun delvist og buggy. Derfor er der ingen grund til at bruge XHTML, som WWW ser ud nu - og det næste lange stykke tid.
mewm skriver godt nok: "Du kan sagtens kode op i mod XHTML standarden, men den behøves ikke være valid"
- men da dokumenterne så parses som dårlig HTML-tagsoup, ville det være en rigtig skidt idé. Der er ingen grund til at skaffe sig ulemper på halsen, når man ikke får fordele til gengæld ;o)
Ligesom der rundt omkring stadig lever Amiga-geeks i støvede skabe, vil der sikkert i en tid fremover være et parallelt HTML-net ... men der, hvor det virkelig sner, kommer den helt afgjort til at stå på XHTML. Fordele og muligheder ved XHTML/XML er så store, at der ikke er nogen - bare lettere avanceret - koder, der vil gide beskæftige sig med HTML som andet end et nostalgisk, historisk fænomen. Det må således forventes, at der indenfor de næste par år kommer til at ske den måske største omvæltning på WWW, vi har været vidne til siden 1992.
Umiddelbart er der således al mulig god grund til at skrive XHTML ...
Njaaahhh, det er egentlig ikke browserkompatibilitet, der er problemet. Nærmere det, at XHTML endnu kun er en eksperimentel standard og at ingen endnu understøtter det ordentligt ... og samtidig er der kun uendeligt få, der kan skrive valid kode til standarden =)
Har nu læst artiklerne igennem, og forstår udmærket hvor du vil hen.
Jeg har ikke gået nærmere i dybden med XHTML ud over det gængse med hvilke HTML-tags der går ud, alle tags skal lukkes osv. osv. Men XHTML1.1 må vel være et skridt i den rigtige retning for at "fremtidssikre" sine sites..?
Sagt på en anden måde: her i overgangsfasen er browseren måske bedst tjent med HTML4.01, men i det lange løb ligner XHTML1.1 vel mere den kommende XHTML2.0 end HTML4.01 gør? Nu hvor du selv nævner det med at skifte over-night...
Ole, nu tænkte jeg mere med alt skal være i lowercase. (embed kan ikke valideres uden JS) Self skal koden være nogenlunde valid. Jeg tænkte forkert, mener at CSS kan blive svær at validere eftersom at man nogle gange er nød til at bruge IE hacks for at få det til at se rigtig ud i browsere.
madssch >> Jo, 1.1 er nærmere 2.0, men personligt foretrækker jeg HTML4.01-Strict, til jeg kan begynde at bruge XHTML2.0 :)
Faktisk er det ekstremt sjældent, jeg har brug for IE-hacks - og når jeg har, gør det ondt langt ind i sjælden at være nødt til at bruge dem ... det er altid noget skidt at bygge sin kode på browser-bugs (og de kendte IE-CSS-hacks er alle bugs). Somregel laver jeg hellere små ændringer i designet.
Hvornår man skal bruge tabeller - og til hvad - er en lang og ofte religiøst præget diskussion. Alt for ofte ser man dog kodere sende browseren på voldsomt overarbejde (med både lange CSS- og JS-koder) for at undgå en tabel. I den slags scenarier er det lidt vanskeligt tage argumentet om, at tabeller er for resourcekrævende, alvorligt. Det virker mere ideoligisk end gennemtænkt at undgå tabellen i en sådan situation =)
Sidder p.t. med en udfordring, hvor jeg har to sidestillede layers som udgør 2 spalter. Det gør jeg ved at sætte float: left på den venstre. Da jeg ikke ønsker, at højre kolonnes indhold skal "flyde" omkring den venstre, sætter jeg højden på den venstre layer til 100%.
Det virker alt sammen meget godt i IE og FF, men ikke Opera. Så har jeg i stedet prøvet at sætte noget margin-left på min højre kolonne, til at skubbe den "forbi" den venstre. Så eksploderer siden i IE og FF, men ikke Opera! :D
olebole > Du virker som en mand med fuldstændig styr på dette område. Derfor spørger jeg dig til råds:
Jeg skal til at opbygge en stor portal. Portalen skal som tidligere nævnt skulle ses på mange forskellige medier. Jeg er p.t. kun i besiddelse af min mobiltelefon. Henter jeg portalen frem på den, spunker alle CSS-elementerne, men de få ting som er opbygget i tables står perfekt. Er det "ulovligt" at opbygge templaten i tables og så måske angive bredder m.v. i css?
Og hvad mener du dette vil betyde for XHTML2-standarden? Jeg mener, de afskaffer vel næppe tabellerne, eller..? Kunden er vel næppe interesseret i at betale for en portal som er outdated om 1 år...
Tabeller er uundværlige elementer og de udgår ingenlunde i XHTML 2.0 :)
Tabeller er ikke egnet som deciderede layout-elementer, hvor de nestes for at holde styr på resten af elementerne. En enkelt tabel til opdele siden i søjler er dog hovesagelig kun i stand til at fornærme de mest 'hysterisk rettroende' (og det er i øvrigt forbløffende mange) ... der er til dato ikke lavet en browser, der har problemer med det =)
Fordi tabeller nu er bygget fra Tim Berners-Lees grundlæggende opbygning af html, hvor de var nødvendige for at give en rimelig repræsentation af videnskabelige data i tabelform, er der jo ingen der siger, at de ikke kan udvikle sig, fordi de har nogle fornuftige evner ...
-- det ville jo også være forfærdeligt, hvis man havde haft den samme tilgang til hjul, og derfor fortsat kun havde tilladt brugen af sådanne til vandingssystemer (som de oprindeligt fandt deres brug i !-)
Én ting er selve sideopbygningen - en anden er det at skulle lave noget i skema-form. Her er tabeller nu det foretrukne..!
Synes godt om
Ny brugerNybegynder
Din løsning...
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.