19. juli 2012 - 16:38Der er
46 kommentarer og 1 løsning
2 kolonner, width på den ene skal være dynamisk..
Hej
Jeg har problemer med at løse dette relativt simple design problem.
Jeg vil genre have 2 kolonner/felter ved siden af hinanden. Kolonnen/feltet til højre skal have en dynamisk width (dvs gør man browser vinduet større/mindre skal dette felt automatisk justere sig)
1. Det skal holdes i css/html 2. Må ikke bruge tables
eneste grund til at jeg ikke bruger dette, er at jeg gerne vil sætte en min-width på "kolonne 2", sådan at den hopper nedenunder, hvis wrapperen bliver for lille.
Tak for dit indlæg, det virker jo ganske glimrende.
Eet problem.. jeg kan ikke få den til skubbe kassen til højre nedenunder den første (hvis vinduet bliver for lille:
Har prøvet at sætte min-width;
<body> <div style="margin:auto;width:80%;position:relative;background:yellow"> <div style="width:320px;height:320px;background:red"></div> <div style="display:min-width:400px;position:absolute;height:320px;top:0;left:330px;right:0px;background:blue;">Tralalalalal la la ala l al ala l al ala l la la la la la la la la la la la la l lala lala</div> </div> </body> </html>
<body> <div style="margin:auto;width:80%;position:relative;background:yellow"> <div style="width:320px;height:320px;background:red"></div> <div style="min-width:400px;position:absolute;height:320px;top:0;left:330px;right:0px;background:blue;">Tralalalalal la la ala l al ala l al ala l la la la la la la la la la la la la l lala lala</div> </div> </body>
Scootergris, tak for linket.. jeg vil prøve at kigge på det. det MÅ kunne lade sig gøre.. det er jo basic stuff (set fra design mæssigt perspektiv!) - og man skulle tro html netop kunne håndtere sådanne ting.
"det er jo basic stuff (set fra design mæssigt perspektiv!)" >> Says who? Hvorfor skulle det være 'basic stuff'? 'Basic stuff' er det, HTML er skabt til: At placere alle elementer under hinanden. Alt andet er ret avanceret *o)
Jeg kan huske, da WWW og HTML blev udviklet, og så interesserer jeg mig naturligvis for det, jeg går rundt og roder med =)
WWW/HTTP/HTML er teknologi, der blev skabt på det europæiske atomforsøgscenter CERN i årene omkring 1990. Det var et paragraf- og tabelsystem, som skulle sikre videnskabsfolk kunne dele deres forsøgsresultater i form af tekstafsnit og tabeller.
HTML er en viderudvikling af SGML, som igen kommer fra GML. Begge dele blev anvendt i tekstbehandligssystemer - altså også tekstafsnit og tabeller, stillet over og under hinanden.
Det er i al sin enkelhed, hvad HTML er skabt til =)
Jeg har for ikke så lang tid siden siddet med præcis samme ønske (=krav) til en løsning og det kan ikke lade sig gøre. Det tætteste du måske kan komme er at benytte media queries.
#9: Naturligvis! Og det er jo præcis, hvad du får at vide *o)
Du gav udtryk for manglende forståelse af, hvad der kan lade sig gøre i 2012. Derfor vurderede jeg blot, det ville lette din forståelse, hvis du kendte baggrunden for, hvad der kan lade sig gøre, og hvad der ikke kan lade sig gøre - samt hvorfor =)
Jojo..men du siger det som at jeg sidder og arbejder med en teknologi der blev udviklet i 1991,men nu er vi ved generation 5?.. og vi kan vist godt blive enige om at html er ikke længere kun noget med at putte ting oven eller under hinanden.. Det er ifølge eksperterne (dvs dem der følger med nutidens teknologier) noget med at afvikle video, lyd, 3d..kaffe.. lapdance ..ja det meste ( og cirka 60+ gange bedre end flash, ifølge Steve Jobs )
Aaaaanyways.. i gir flødeboller hvis jeg får det til at virke i ren html/css ..deal?
Det er der da også rigtig god grund til - alt andet ville være en skandale. Hvis ikke professionelle fagfolk skulle vide, hvad de taler om, ville vi godt nok være langt ude!
En næse-, øre- halslæge ved jo også, hvad der skal til for at hjælpe en patient med polypper - og en automekanikker ved, hvad han skal gøre ved en tilstoppet strålespids i en karburator =)
Jeg kan godt lide du er så sikker på at der er en løsning, askalot. Jeg kan også skrive under på det som olebole og keysersoze fortæller dig.
Selvom jeg uden tvivl ikke har samme erfaring som de 2, kender jeg stadigvæk de teknologier som vi arbejder med. Men du er da velkommen til at spilde din tid på at lede efter en løsning der ikke findes.
Tror jeg i den forbindelse vil give mig til at bede en bøn til gud. :)
Ellers tak, jeg samler ikke point. Det kan være keysersoze eller DeeDawg kan overtales. Ellers lægger du bare selv et svar og accepterer det, så tråden lukkes =)
Du må ikke misforstå. Jeg har absolut respekt for din ukuelighed - og jeg genkender den fra dengang, jeg selv begyndte på webkode.
Men OMG, hvor har jeg dog spildt megen tid på at jagte løsninger, som andre og mere erfarne folk fortalte mig var blindgyder. Og så alligevel ikke helt, for jeg lærte trods alt noget brugbart i mine famlende og insisterende forsøg på at finde 'den flyvende gris' *o)
HTML5 og CSS3, er endnu ikke en standard, og derfor kan det foregående endnu ikke være forældet. Desuden har dit forslag intet med HTML at gøre, og alligevel finder du dig selv i en position til at stille spørgsmålstegn ved #16?
#27 Netop derfor er det tåbeligt at bede mig overveje #16. Det er jo præcis forskellen på amatøren og dn professionelle. Den professionelle har ikke råd til den slags luksus. Hans produkter skal virke, også når brugere anvender lidt ældre browsere, hvis han forventes at servicere seriøse kunder.
HTML5 er endnu ikke standard - og ingen ved med sikkerhed, om det nogensinde bliver standard. Det kan stadig nå at gå, som det gik med XHTML =)
#28: Utroligt jeg gider skrive det her. Uanset om HTML5 og CSS3 er en standard eller ej, så virker løsningen i moderne browsere. Og da du åbenbart ved alt om HTML, ved du også, at HTML ikke er et stykke software, hvorfor det naturligvis er forældede versioner af IE jeg refererer til - men det skal vi ikke diskutere.
#29: Når der bliver refereret til HTML5, er det så ikke misvisende at sige, at der ikke findes en løsning? Det er ikke særlig professionelt, hvis du spørger mig. At løsningen så ikke virker i browsere fra 1991, der burde være opdateret, er naturligvis en fin kommentar - men det ændrer ikke på det faktum, at der findes en moderne løsning.
#21 Ole, jeg forstår! ..men aærlit, har du ikke bare én eller to gange fundet en løsning, selvom der var nogen der sagde at det ikke kunne lade sig gøre? Det jo i sig selv er ganske tilfredstillende ^^
Jeg ved jo i realiteten ikke hvem jeg snakker med her, men efter som du er ret overbevisende..samt at de andre brugere er enige med.. så tror jeg da på det =)
Anyways, jeg kan løse dette med et støttehjul af javascript.. så det går nok alt sammen ;)
#33: JS til at løse layout med er ikke særlig elegant. Hvorfor er det, du vil have den højre kasse til at hoppe ind under den venstre? Er det af hensyn til mobilenheder, eller?
Måske, man kalder det sådan - men jeg tror (håber), det dækker over noget lidt andet. 'Tilfældighed' er for mig det modsatte af 'design' - og jeg synes ikke det ser særlig pænt ud. Kasserne er helt klart skabt til at sidde side om side (Hvad var dét, du skrev, Ole ..?!??!!!) - ikke over hinanden.
I sådanne situationer foretrækker jeg en speciel version, tilpasset små skærme, og som loades, hvis serveren detekterer, at forespørgslen kommer fra en mobil
Den eneste grund at foretrække dette (frem for ren personlig preference) - er vel at; det er bedst at alt er klappet og klart når siden er loadet.. og at man ikke først dér skal til at lappe med javascript.. right?
"Lytteren er nok ligeglad, så længe højttaleren bare siger noget" >> Ja, du har nok ret derhen, at de fleste mennesker er vandt til at kikke på grafik, der er lavet af folk, som aldrig har fået en formel uddannelse med fag som 'komposition' og 'formlære' =)
Et af de vigtigste matraer, du lærer under en uddannelse f.eks. på Grafisk Højskole, er, at 'Skønheden lever i det hvide land'. Det hvide område - det udenom indholdet - er ekstremt vigtigt for grafikkens/tekstens virkning på seeren/læseren. Derudover lærer du en masse om et hav af forskellige kompositionsprincipper, det gyldne snit, det gyldne rektangel, osv, osv.
Alt sammen ekstremt vigtige detaljer, som det desværre er ved at være normen at blæse på. Og du har sikkert ret: Grimhed - eller i bedste fald 'fravær af skønhed' - er helt fint ... "Bare det virker". Vi danskere er jo også kendt for at være det folk i Europa, der procentvis bruger mindst på vores mad ... "Bare sækken bliver fyldt, så til H*** med, hvordan det smager!".
Ja, den trend efterlader mig ganske uimponeret. Desværre :o|
Det er desværre svært at få lov at spørge eller kommentere på noget herinde, uden at olebole og hans venner skal sætte spørgsmålstegn ved din faglighed, din uddannelse og dit valg af løsning. I stedet for at komme med løsninger kommer de med udokumenterede udsagn, og belærer om designprincipper fra uddannelser, der ikke engang findes længere. Så skal vi ikke finde en løsning på problemet, i stedet for at diskutere ligegyldige påstande?
Den løsning jeg gav dig, wrapper automatisk i nye browsere, men ikke i IE8, som derfor er problemet nu. - Er det overhovedet nødvendigt at designet wrapper i IE8? Har folk med IE8 i forvejen en stor nok skærm til at det ikke er nødvendigt? - Du kan sagtens løse problemet med javascript, ved at lægge en ekstra CSS-class på kolonne2 ved onload og onresize, hvis skærmen er for lille? Det virker, og det er ikke uset at benytte javascript til at styre layout. Fx bruger microsoft javascript til styre layout af deres ribbon-bar i SharePoint - som må siges at være et ganske professionelt produkt.
Qobra, din hjælp er helt sikkert også værdsat, og jeg er også lidt enig med dig.
Men grunden til at det skal virke på XP.. er at mange(nogle) store virksomheder sidder stadig fast i XP.. = IE8 ..det er bare et fact jeg ikke kan se ud over.
Så ja, som du siger.. jeg laver det bare med et ekstra css stylesheet.
Bruger alligevel LOADS of javascript på sitet. så det går nok alt sammen... Men kan da godt se at det er bedst at have det meste åp plads med styles fra doc load.
--
#42 jeg mente at brugeren nok er ligeglad med, om jeg har brugt javascript til at fixe det med..bare det virker, men da ikke på bekostning af "designet"...det er jo netop pointen.
I min verden er det "ok" at bruge "lappe løsninger" for at få det til at virke..så længe brugeren får en god oplevelse.
"Lappe løsninger" , Som jeg ser det.. basalt set så går man, som udvikler, bare nogle ekstra skridt for at give kunden/brugeren den oplevelse man gerne vil. (kommer an på hvem man laver det for ;)) - og det er mine øjne kun positivt
Lige en note, hvergang jeg har brugt ordet "design" er det i visuelt sammenhæng.. ikke teknisk.
@Qobra: Med dine holdninger og dit kompetenceniveau kan jeg godt forstå, du er så forhippet på at snobbe nedad. Det skal dog ikke holde mig fra at argumentere udfra en faglig baggrund. Om uddannelsen ved Grafisk Højskole eksisterer i dag, er rystende ligegyldigt. Den har født adskillige (web)grafikere i den absolutte verdenselite, så det kan kun begrædes - hvis man da ellers har respekt for faglig kunnen.
Hvad venner angår, bør du nok holde dig til at udtale om dine egne. For det første kunne jeg forestille mig, det ville være mere overskueligt - og for det andet har du ingen anelse om, hvem der er mine venner, og hvem der ikke er. På den anden side har den slags 'akademiske detaljer' jo aldrig afholdt dig fra at udtale dig.
"udokumenterede udsagn" >> skrev han uden skygge af dokumentation!
"Så skal vi ikke finde en løsning på problemet, i stedet for at diskutere ligegyldige påstande" >> Sagde brugeren med 10 aceepterede besvarelser bag sig til manden med over 4.000!
"Er det overhovedet nødvendigt at designet wrapper i IE8? Har folk med IE8 i forvejen en stor nok skærm til at det ikke er nødvendigt?" >> Hvad ...?!??!!! Hvorfor skulle IE8-brugere dog have mindre skærm?
"Det virker, og det er ikke uset at benytte javascript til at styre layout." Nej, og det er tabeller heller ikke - men det er ikke god praksis. En af de helt store fordele ved CSS er jo netop at have ét sted at vedligeholde designet.
"Fx bruger microsoft javascript til styre layout af deres ribbon-bar i SharePoint - som må siges at være et ganske professionelt produkt." >> Der er en verden til forskel på kravene i webapplikationer og websites. Desuden har hverken Sharepoint eller MOSS nogensinde været kendt for et godt, velfungerende interface. De har over de seneste versioner været inde i en positiv udvikling, men de mangler stadig *meget*!
askalot:"I min verden er det "ok" at bruge "lappe løsninger" for at få det til at virke..så længe brugeren får en god oplevelse." >> Jamen, jeg har intet imod, at du synes det. Gennem 12 år på Eksperten har jeg mødt ekstremt mange med den holdning. *Rigtig* mange har vi efterfølgende set komme tilbage, når tingene på et tidspunkt alligevel viste sig ikke at være så fikst - og stå i vejen for andre løsninger.
God kodepraksis handler i høj om ikke at skyde sig selv (eller den, der evt. senere skal vedligeholde koden) i foden. Når professionelle webudviklere rådgiver med rod i 'god kodepraksis', er det ikke for deres egen skyld - det er faktisk for spørgerens skyld *o)
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.