Placering af elementer

<ole>

"Hvordan styrer man bedst ens elementer vha. html/css, så jeg hurtigt og let opbygge en struktur til en hjemmeside?"

Du bruger et par år eller tre til at sætte dig grundigt ind i faget. Med nogle yderligere års erfaring/træning når du muligvis til at kunne gøre det 'hurtigt og let'

/mvh
</bole>

Det er desværre ikke så let og logisk men du kan bruge et færdig lavet 3 column layout som det her : http://matthewjamestaylor.com/blog/perfect-3-column.htm

Du behøver jo ikke forstå koden for at bruge den.

Hvis du har den mindste interesse i webkode, kan det ikke anbefales at anvende kode, du ikke forstår. Det er der allerede alt for mange, der gør - og Matthew James Taylor er såmænd et udmærket eksempel

Kære Olebole
Du sidder tilsyneladende med en kæmpe viden om webprogrammering, som du kunne berige alle os andre med:-) Hvor kunne det være en kæmpe gave både til dig selv og alle os brugere på eksperten.dk, hvis du hjalp andre og delte ud af denne viden.

I stedet påpeger du ofte, hvordan enten at spørgsmålet ikke er stillet korrekt eller at spørgsmålet er for generelt. At bud på løsninger er forkerte, da den som har kommet med "løsningen" har misforstået hele eller blander forskellige ting sammen samt henvisninger til løsninger på nettet, at disse også er fulde af fejl.

Hvor vil det være skønt, at i stedet for at påpege andre fejl, at du kom med løsningen eller et bud på en løsning. Det vil være langt mere positivt og konstruktivt.

Det eneste jeg vil sige med dette indlæg er, at eksperten.dk skal være et forum, hvor der er plads til alle og hvor alle føler sig velkommen. Et forum, hvor vi vidensdeler, kan stille spørgsmål og hjælper hinanden (efter bedste evne) samt i fællesskab finder den bedste løsning på et konkret problem/udfordring og udfordre hinanden til at blive bedre.

Lad os ser fremad og bruge hinandens ressourcer, så eksperten.dk kan blive et endnu bedre forum for alle.

Hav en vidunderlig dag:-)

Jamen, hvis du mener, der skal gives en programmatisk løsning i en tråd på Eksperten, mener jeg, din grundlæggende præmis er forkert.

Det nytter jo ikke meget at få en løsning, du ikke fatter hat af. Den sidste linje i dit spørgsmål viser, du er spejlblank i HTML/CSS. Så kan du da dårligt få et mere konstruktivt eller relevant svar, end at du naturligvis må investere en masse tid i at lære HTML/CSS.

Dit 'krav' er at få at vide, hvordan du kommer til at kunne "hurtigt og let opbygge en struktur til en hjemmeside". Du forventer med andre ord, at vi skal lære dig et fag i en E-tråd. Det er jo komplet urealistisk!

Det er muligt, du ikke finder det positivt eller konstruktivt at informere dig om, at du må gøre en væsentlig indsats for at opnå det, du ønsker. Det må skyldes, du ikke har den viden, du så gerne vil have, vi skal dele med dig og derfor ikke forstår rækkevidden af, hvad det er, du vil.

På Eksperten bestiller vi ikke andet end se fremad og bruge hinandens ressourcer. Jeg tror jeg ikke, man skal forvente sig, at Eksperten bliver 'et bedre forum', hvis det betyder, at man skal være garanteret en løsning. Mange løsninger kan ikke gives i Pixi-format, men kræver en stor, personlig indsats. Det bør Eksperten naturligvis afspejle, hvis forummet skal bevare sin troværdighed

Suk.

Jeg vil nok støtte mig til holdningen om at bevare indlæg løsningsorienteret OG i en positiv tone - også selvom det kræver en indsats, at dele ud af sin viden. Måske lærer man noget undervejs..


Til at starte med bør du nok rode med div og floats - og her er det nemmere at poste nogle links, så du kan komme igang og derefter stille nogle mere konkrete spørgsmål ;-)

http://www.html.net/tutorials/css/lesson13.php
http://www.barelyfitz.com/screencast/html-training/css/positioning/

Det er vigtigt at få styr på padding,border,margin forholdet og hvordan du styler en div, en ul (unordered list) og en table.

Hvis du lærer det, så er du rigtig godt på vej, brug google.

Håber det hjælper.

Hvor er det dog positivt, at folk som du - i sukkende overbærenhed - deler ud af dine store erfaringer med besvarelse af Eksperten tråde. Dog behøver du ikke være i tvivl om, hvorvidt man lærer noget ved at dele ud af sin viden.

Den smule erfaring, jeg har samlet gennem 13 år, 55.000 indlæg og 4-5.000 besvarelser, peger i hvertfald i retning af, at begge parter lærer en masse af seriøs og kompetent vidensdeling. Det kan jeg absolut kun anbefale  =)

Du mangler dog at fortælle lidt om, at float af rigtig mange misforstås derhen, at den skulle være beregnet til at stille block elementer ved siden af hinanden. Men det er display:inline-block beregnet til.

Meningen med property'en float er - som navnet antyder - at lade et element flyde ude af sidens naturlige flow ... så det bliver muligt at lave flydende tekstomløb om f.eks. et billede.

Når man gerne vil have elementer til at ligge ved siden af hinanden, bruger man inline elementer. Er det yderligere et krav, at disse elementer skal kunne indeholde block elementer, bruges inline-block elementer som container.

Det er ikke uden grund, at float blandt mange udviklere betragtes som den ny nummer ét af abuses - afløseren for 'TABLE til layoutformål'  *o)

'Løsningsorienterede indlæg og positiv tone' er ikke nødvendigvis kendetegnet ved høflig snakken efter munden og links til mere eller mindre lødige artikler. Det er langt mere venligt overfor brugeren at være ærlig og give et realistisk billede af, hvordan man lærer at kode ordentligt. At alle så ikke evner at modtage den slags beskeder, er en anden ting - men det gør den ikke mindre konstruktive eller positive. Naturligvis forudsat, at man ser lærdom og viden som noget positivt  =)

Jeg glemte det ikke - jeg skriver at der er en masse "know how" - hvilket må inkludere det du påpeger med floats.

Er det virkelig nødvendigt for dig at være så offensiv og angribende i din formulering?

Så har du skrevet en masse indlæg, det var flot, det har sikkert taget en masse tid, og det er tydeligt at du føler dig enormt priviligeret og bedre end andre herinde, måske netop af denne grund. Det er da bare en skam - at størstedelen af dine indlæg (som tidligere nævnt af nph12) ikke bidrager til at løse problemerne, men istedet er enormt konfiktsøgende, selvhævdende og brok.

Tal dog til andre som du gerne vil tales til. Eller i hvert fald tal til andre som de taler til dig.

Jeg taler præcis til folk, som jeg ønsker, at folk måtte tale til mig i en tisvarende situation  =)

Hvad glemte du ikke? Du bilder brugeren ind, at han bør koncentrere sig om DIV og float. Men float er jo præcis det, han ikke har brug for i denne situation. Float er det i det hele taget sjældent, man har brug for. Langt de fleste situationer, hvor float (mis)bruges, ville inline-block med fordel anvendes - uden man behøver at 'hacke' sig ud af uhensigtsmæssigheder med clear.

Du har fuldstændig ret i, at en bruger ved navn nph12 også har brokket sig. So what! Du kan finde myriader af tråde, hvor jeg bliver takket for en seriøs og konstruktiv tilgang.

Spørgsmålet lød:

"Hvordan styrer man bedst ens elementer vha. html/css, så jeg hurtigt og let opbygge en struktur til en hjemmeside?"
Spørgeren søger med andre ord et professionelt vidensniveau. Så må det eneste begavede svar da være, at det tager en årrække. Han ønske kræver jo, at han lærer et helt fag!

Du har nok heller ikke så meget at lade andre høre, hvad angår arrogant optræden. Således lagde du jo selv en kommentar, hvor du pigesukkende af opgivelse insinuerede, at jeg måske kunne lære noget af at dele ud af min viden. Uden nogen somhelst viden om, hvad jeg i øvrigt har fortaget mig indenfor dét felt. Hvem er konfliktsøgende?  :D

Faktisk har jeg på forskellige erhvervsskoler undervist både webintegratorer og multimediedesignere, hvor over 50% af mine elever har fået 10 og 12 til eksamen i mine fag. Inden jeg blev webudvikler, var jeg lydtekniker i 20 år og har indenfor dét fag undervist på Rytmisk Center og Rytmisk Konservartorium med ligeså gode resultater. Derudover har jeg som sagt gennem 13 år bidraget med viden her på Eksperten.

Som sagt kan jeg kun anbefale, at man deler sin viden - og jeg gør det på baggrund af en meget lang og substantiel erfaring på området. Du har fuldstændig ret i, at man også selv kan blive fagligt bedre af at hjælpe. Prøv det selv!  *o)

Det er jo dét jeg prøver på :) jeg kan ikke prale af en lignende erfaring, og du må undskylde at mit indlæg blev lidt personligt - og søgende.. Morale er jo godt :D

Jeg er faktisk ikke opmærksom på det du siger mht. uhensigtsmæssigheder og floats. Jeg ville umiddelbart bruge floats (og en clear div som hack :) - derefter lave inline-block(og andre "hacks") enkelte steder for at få IE til at vise det helt korrekt.

Du gør mig meget nyskerrig. Jeg vil meget gerne forstå dit argument for at inline-block er en fordel frem for floats? Har det nogen praktisk konsekvens af bruge floats? Og i hvilket sjældent tilfælde skal man så bruge floats istedet?

Så jeg selv, fremover kan gøre det korrekt - og argumentere hvorfor.

Jeg har læst multimediedesigner, bachelor i webudvikling, master.it - og så har jeg (kun) ca 4 års erhvervserfaring. (så det er nok ikke dig der har undervist mig). Hvis det du siger er korrekt - så er det uhyggeligt så mange der laver det "forkert" ude i erhvervslivet.

Vil du ikke nok vise et simpelt eksempel på: Hvordan man bør skrive, en korrekt css med inline-block, for at aligne disse divs. (2 columns). Så vil jeg være meget taknemmelig (og nph12 kan c/p paste koden og komme ordenligt igang). (også selvom det strider mod til ytring om ikke at skrive kode herinde).

html:
<div id="container">
    <div id="left"></div>
    <div id="right"></div>
</div>

css:
#container
{

}
#left
{

}
#right
{

}

Mvh. :)

Udgangspunktet er at bruge HTML-elementer og CSS-properties, som de er tænkt - og på den måde, som medfører færrest 'særheder' med deraf følgende, nødvendige 'hacks'.

Indenfor HTML arbejder vi med to hovedtyper af elementer: Block og inline elementer. Block elementer er qua default stylesheet'et født med display:block og inline elementer med display:inline.

Block elementer lægger sig over/under hinanden og danner pr. automatik et linjeskift før og efter elementet. Inline elementer lægger sig ved siden af hinanden uden linjeskift. Inline-block elementer opfører sig fuldstændig som inline elementer - med den undtagelse, at de kan indeholde block elementer.

Du har helt ret! Havde jeg undervist dig, havde du ikke haft så svært ved helt grundlæggende stenalder HTML. Det undrer mig, du er nødt til at spørge om den slags ting med den uddannelsesbaggrund, du påstår at have.

Jeg er helt på det rene med, at den danske erhvervesskolestruktur er totalt inkompatibel med IT-undervisning, men med en bachelor i webudvikling er det rystende, at du ikke kan finde ud af at stille to inline elementer ved siden af hinanden! Det svarer til, at en elektrikker ikke kender forskel på jævn- og vekselspændinging!

Du giver #left og #right display:inline-block. Så lægger de sig naturligvis ved siden af hinanden, som alle andre inline elementer har gjort siden begyndelsen af 1990'erne. Hvad er det lige, der er så svært?

Det er da også ret underligt, at du aldrig er blevet undervist i det uhensigtsmæssige i at flå elementer ud af sidens naturlige flow. Det er f.eks. almindelig kendt, at position:absolute giver bunker af problemer og derfor bør bruges så sparsomt som muligt. Blandt udviklere er det også almindelig kendt, at float giver problemer, da man altid må hacke sig ud af følgerne med clear.

En HTML-side har et naturligt flow, som er bestemt af den måde, HTML elementerne i udgangspunktet er beregnet til at lægge sig i forhold til hinanden. Brydes dette flow, vil man altid skulle 'hacke' sig ud af de uhensigtsmæssigheder, brudet medfører.

Nej, det er ikke spor underligt, at der er så mange, som skriver elendig kode ude i "erhvervslivet". Det er i høj grad befolket af folk helt uden eller med yderst ringe uddannelse - og som heller ikke på anden måde har evnet at bibringe sig selv indsigt i faget.

Slå fejlmeldinger til i din browser og surf. Du vil opdage, at du bliver tæppebombet af JavaScript-fejl, som skyldes indlysende fejl, ingen fagmand burde lave. Hvis du tilmed prøver at validere koderne, vil du opdage, at det ser seriøst problematisk ud! Men som Margrethe Den Første plejer at sige: "Sådan er det jo!"  *o)

- og så forstår jeg ikke hat af bemærkningen "(også selvom det strider mod til ytring om ikke at skrive kode herinde)." ..?!?!!

PS: Du spurgte vist også om, hvad du så bør bruge float til. Property'en er skabt til at lave flydende tekstomløb omkring en kasse - f.eks. et billede. Det er den genial til, og du behøver ikke drible rundt med mere eller mindre fantasifulde clears.

Har du en H1-overskrift med en skriftstørrelse på 24px, og du gerne vil have et ikon liggende helt ude i højre side af overskriftens boks, er der to muligheder. Du kan give ikonet float:right. Eller du kan positionere H1-elementet relative og ikonet absolute og placere ikonet med top/right/bottom/left. Ingen af delene skaber problemer, da teksten i overskriften i sig selv spiler boksen ud - og 'hacks' er overflødige.

Anyway, at du (for nu at holde en overmåde pæn tone) er så usikker på helt elementær HTML/CSS efter en uddannelse som multimediedesigner - en bachelor i webudvikling - samt en master i IT, viser jo med al ønskelig tydelighed, at min kommentar fra #1 holder bunker af vand:

"Du bruger et par år eller tre til at sætte dig grundigt ind i faget. Med nogle yderligere års erfaring/træning når du muligvis til at kunne gøre det 'hurtigt og let'"  *o)

Jeg hentyder til at der i starten af tråden blev sagt noget om at man ikke bør skrive kode i en tråd herinde.

heh. Du er noget for dig selv :) Gider du ikke nok holde dine twistede antagelser om min viden, uddannelse og evne til at forny mig - for dig selv.

Jeg er udemærket klar over at der er block og inline elementer - og deres behavior. Det er dog længe siden jeg har nærstuderet html - og når jeg til hverdag arbejder med databaser og back-end - er det vel tilforladeligt at glemme nogle teoretiske ting (på trods af html-undervisning for ca 8 år siden). HTML plejer ikke at være et issue i det arbejde jeg laver. (det er ikke mig der laver det)

Jeg kunne da godt have googlet svaret selv, men jeg forsøger at bringe lidt positiv stemning til tråden, ved at stille dig et spørgsmål, om noget du tydeligvis ved en masse om - som også ville gavne problemstillingen i selve tråden.

Tilgiv mig at at have begået denne store fejl, at give dig muligheden for at fortælle mig noget - det kan du tydeligvis ikke håndtere.

Hvorfor er det så vigtigt for dig at få andre til at fremstå som idioter? Hvis det også er sådan du underviser dine elever - så tvivler jeg på, at du ville kunne lære en hund, at slikke sig selv i røven - også selv om du er ekspert på området.

"Hvorfor er det så vigtigt for dig at få andre til at fremstå som idioter?"

- og det spørger du om ...?!?!! Kik dog på din egen entré i denne tråd - smag lidt på dit bidrag til 'den gode stemning' - og tag så en tudekiks!

Det er uden tvivl nogle avancerede hundekurser, du forlyster dig med. Jeg tror dog, de er lidt for langt fra substansen i denne tråd - så de færdigheder må du selv stå for udbredelsen af

Mener du "suk"?

Det er ellers noget af en antagelse, at det skulle være et "angreb" - og at det er rettet på dig.

Tudekiks? Tak men ellers tak ;-)

Arj. jeg forstår dig godt.. Suk er et meget offensivt ord - hvis nogen kom og sukkede foran mig - så ville jeg virkelig blive primitiv. fnis.

Og således - med dig endelig bragt i god stemning til 'intellektuel' humor - vil jeg se frem til, at vi kan få lukket tråden. Spørgsmålet må vel siges at være rigelig belyst  =)

Så du mener helt seriøst at mit "suk" er den bidragelse til den dårlige stemning, der får dig til at regere så voldsomt - det er jo latterligt.

Ja det kan man da sige at det er.

Det er altid rart at kunne bidrage til latter og godt humør, men det ville være velgørende, hvis du kunne se det hensigtsmæssige i at holde dig til at udtale dig om, hvad du selv mener. Rækker din forståelse ikke, ville det klæde dig at undlade at lægge ord i munden på andre

Så når du skriver:

"Du har nok heller ikke så meget at lade andre høre, hvad angår arrogant optræden. Således lagde du jo selv en kommentar, hvor du pigesukkende af opgivelse insinuerede, at jeg måske kunne lære noget af at dele ud af min viden. Uden nogen som helst viden om, hvad jeg i øvrigt har fortaget mig indenfor dét felt. Hvem er konfliktsøgende?  :D"...

I mit første indlæg forsøger jeg at hjælpe vedkommende der har oprettet tråden. Jeg skriver "suk" fordi jeg ærgrer mig over den drejning tråden er ved at tage - måske skulle jeg have været lidt mere klar i mit udtryk. Det var ikke ment som en personligt angreb på dig. Det er dig selv, der vælger at opfatte det sådan.

Som vi begge forsøger at holde tråden til emnet - og du faktisk besvarer mine spørgsmål ganske glimrende, formår du alligevel samtidigt at sammenligne mig med:
- en der er arrogant
- en elektrikker ikke kender forskel på jævn- og vekselsspænding.
- en person med ringe uddannelse, "som heller ikke på anden måde har evnet at bibringe sig selv indsigt i faget."
- og en hel del andre professionelle tilsvinelser.

Hvis du stiller nogle faglige spørgsmål, som en anden bruger til at konkludere de værst tænkelige antagelser om din uddannelse og professionalisme - for bagefter at konkludere det som sådan højt i tråden.

Så tror jeg ikke du ville lade det ligge ved det, det ville som være som en tilståelse af disse - hvor retorisk korrekte, velformulerede og fuldstændigt forkerte disse tilsvinelser end måtte være. Det er her det personlige og barnlige starter.


Så Ole, jeg vil tænke over det du siger - mod at du selv tager dit eget forslag op til ærlig efterretning :-)

Og ja, det er præcis det samme jeg selv gør senere i tråden som svar hertil - men det var dig som startede.

Og ja, det er måske også et lidt barnligt grundlag, hvis det hele kommer ned til det, men som dronningen plejer at sige: "Sådan er det jo!".

;-)

Det eneste, jeg havde givet udtryk for, da du kom væltende ind, var, at hvis man ønsker at kunne "hurtigt og let opbygge en struktur til en hjemmeside", så kan man ikke nøjes med at læse et par hurtige - og ofte fejlbehæftede tutorials. Så er man nødt til at investere en masse tid og arbejde i det. Det gælder ikke kun webudvikling ... det gælder alle fag. Det er jo fuldstændig banalt!

Hvis det er en 'drejning i tråden', du ikke bryder dig om, må det være dit problem. Jeg forstår, du mener, den 'drejning' berettigede din fladpandede entré i tråden. Jeg er ikke enig! EOD!

Jeg kunne sige det samme til dig.

Vi kommer ikke videre her :-) Må ha en dejlig og produktiv mandag.