centrering af billede

Prøv evt.

text-align:center

i din #title-style...

Hvis det er dit topbanner du vil centrere, skal du undlade at positionere det via:

  position:absolute;
  left:0px;
  top:0px;

Ovenstående fortæller browseren, at billedet skal positioneres i dit øverste venstre hjørne ;-)

Du kan i stedet centrere billedet via:

#titleImg {
    margin: 0 auto;
    width: 700px;
    height: 110px;
    background-color:#003333;
}

<img src="toplogo1.jpg" id="titleImg" alt="Nice picx">

I øvrigt virker din opbygning med positionerede divs ikke optimal. Du laver et forholdsvis simpelt layout, men skruer det sammen på den mest besværlige måde, du kan finde ;-)

Når du benytter positionerede divs til at opbygge dit layout, skal du virkelig have styr på dine elementer og din CSS. Ellers risikerer du at brugere med andre skærmopløsninger og indstillinger end dine, oplever dine sider som et 'Tetris-spil' der er løbet løbsk.

Hvorfor opbygger du ikke layoutet i et enkelt men simpelt table? Et table kan klare opgaven meget bedre og med færre bivirkninger...

apo>> Nu siger du jo tabel og andre steder siger de tabel NEJTAK!!!

Jeg er forvirret....

Hvorfor, hvorfor ikke??

Det er vist en religiøs "krig" der verserer mellem tabellayoutere og CSS-purister der sværger til ren CSS-layout. Sandheden skal nok findes et eller andet sted i midten, hvor man balancerer brugen af tabeller med brugen af CSS til at layoute sine sider med. "Problemet" med rene tabellayouts er, efter min mening, at koden bliver væsentlig sværere at overskue pga. en masse tabelkode, som dels fylder meget (i koden og på linien) og som dels bevirker, at renderingen af siden kan virke en smule langsommere (da tabeller ikke kan renderes inden de bliver lukket). På den anden side så er rene CSS-sider nok sværere at få til at fungere ordentligt i alle browsere, da der vist er en del forskel på hvor godt de forskellige browsere implementerer CSS. Så du er nok nød til at opveje fordele og ulemper og måske endda gå lidt på kompromis nogle steder - men sådan er livet jo... :)

mccookie > Hvorfor skulle man ikke kunne bruge tables?

Jeg kan godt forstå at du bliver forvirret - Det var jeg også da jeg første gang hørte de modstridende meldinger.

Der er nogle der fejlagtigt tror at man ikke _må_ bruge tables, men det bunder i en misforståelse (olebole og roenving her fra Exp kan fortælle dig meget mere om baggrunden for misforståelsen - Prøv evt. også at søge på nogle af deres indlæg).

Kort fortalt: Der er intet i vejen med at bruge tables, hvor tablet er det element, der løser opgaven bedst. Ofte kan et table løse en opgave med få kodelinjer, hvor du med positionerede divs eller bare divs skal bruge mange kodelinjer og supplere med javascripts for at opnå det samme resultat. Dog er det ikke god kodeskik at bruge mange tables indlejret (nestede) i hinanden.

Jeg bruger selv enkelte tables til opbygning af layout mv., og divs hvor jeg ikke har behov for tables, og har ikke oplevet at det har givet problemer. Tværtimod har jeg ofte oplevet at et table er et let og tilgængeligt element at arbejde med. Og hvorfor gøre tingene mere komplicerede end højst nødvendigt?

Som softspot skriver finder der en mindre religionskrig sted blandt nogle kodere. Du (mccookie) er formentlig stødt ind i nogle af 'CSS-Zengarden Vidnerne', hvis du har hørt, at tables er 'fy-fy' eller 'no go'.

Min 'religion' siger at man bør anvende tables, hvor tables gør gavn, og divs hvor divs gør gavn.

Kan man løse en opgave tilfredsstillende ved kun at kode et enkelt div frem for et table, bør man anvende div'et til opgaven. Kan man derimod bedst løse en opgave ved, at kode et table, frem for flere divs der fylder mange kodelinjer, måske suppleret med javascript for at få det til at virke crossbrowser, bør man anvende et table.

Der er ingen grund til at være religiøs og foretrække det ene frem for det andet. Keep it simple: anvend det element der er mest egnet til opgaven :-)

Og der er endda en anderkendt forkortelse: KISS, Keep It Simple, Stupid ...

-- hvilket ret præcist fortæller, at indbygger man komplikationer, er man selv ude om problemerne !-)

Jeg tror jeg tager chancen endnu engang og siger f... positionering for selve sidens opbygningen ;) og bruger det der hvord et er nemt og enkelt ;)

http://www2.spejdernet.dk/klatring/middesign.php

Nu er jeg begyndt at lægge det ind i et table og nu er den gal igen - JEg kan ikke centrerer det billede  igen....

Brug enten:

<td align="center"> <img id="titleImg" src="toplogo.jpg" alt="toplogo">

eller flg. style:

table.toplogo td {
  text-align:center;
}

Bingo ;)

Smider i snart nogle svar og skal kaster points og tabler efter jer!!

Så kaster jeg et svar, og gemmer mig bag et table ;-)

Kommer der :)

"Der er nogle der fejlagtigt tror at man ikke _må_ bruge tables, men det bunder i en misforståelse" - apo

Der er jo ikke noget sted der står man _skal_ bruge et (markup-)sprog på en bestemt måde. Men hvis man vil følge standarderne, er det altså direkte forkert at bruge et table-element til layout. Det går imod principperne bag både hvad CSS og (X)HTML er beregnet til, sådan som de er defineret i dag. Og dermed altså imod det man ihærdigt forsøger at tilføre nettet, nemlig semantisk mening. Man kan så selvfølgelig også begynde at diskutere hvor vigtigt det er, men det er dog fx det Tim Berner-Lee, 'faren til WWW', bruger meget af sin energi på i disse år, se fx hans weblog: http://dig.csail.mit.edu/breadcrumbs/blog/4

Jeg kan godt forstå hvorfor man kan finde på at bruge et table-element til at klare noget udelukkende layoutetmæssigt, men hvis man har modet på at gøre det på den anbefalede måde (fra W3Cs side, bl.a.), synes jeg så absolut man bør gøre det. Det gør trods alt også, at man er i stand til at ændre layoutet i højere grad, udelukkende ved at ændre i CSS'en.
Desuden er der i dag fundet metoder der gør, at det faktisk ikke er særligt svært at opnå fx et alm. 3-kolonne-layout, uden at gøre brug af tables, hvis man har rimelig styr på at bruge CSS.

KISS er ofte et udmærket princip - men ikke altid. Ligeså vel som med "if it's not broken, don't fix it". Hvis man bruger 'religiøs' i en negativ forstand, bør man måske lige overveje en ekstra gang, om man egentlig selv er det...

-- men der er masser af ting, du ikke kan gøre med css og positionerede elementer, som let og elegant klares med tabeller ...

-- så hvis man vil centrere vertikalt, have synkron højde på flere elementer, fylde en blok med en blanding af elementer med faste og relative bredder m.v. er det simpelthen nødvendigt at bruge tabeller, hvis ikke man skal over i verdens dårligste ide: at basere sit layout på javascripting !o]

-- og da css kan bruges til at sætte visuel præsentation på html-elementer er det simpelthen noget vrøvl at snakke om, at den visuelle præsentation er fuldt adskilt fra html-koden (hvilket i øvrigt også gælder for interaktion, dynamik !-)

I flere tilfælde er det nu muligt at centrere vertikalt, og have en synkron højde på flere elementer, uden at benytte tabeller...
Men der er da absolut mange mangler ved CSS2(.1), det er jo efterhåden også en frygtelig gammel standard (omend den er blevet lettere modificeret en del gange). Og selv med CSS3 vil alle problemerne ikke være overstået; man kan fint finde problemer med selv nogle af de moduler, i dens working-draft, der er ved at blive lagt låg på.

Nu ved jeg ikke hvem det er du tænker på, med din sidste sætning, for så vidt jeg kan se, er det ikke noget jeg skrev. Jeg mener dog ikke det ligefrem er noget vrøvl at sige; upræcist måske, men man forstår meningen med det.