CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg
Cookie ikon
Avatar billede Slettet bruger
06. november 2017 - 20:08 Der er 6 kommentarer og
1 løsning

To div-tags ved siden af hindanden overlapper hindanden...

Hej
Hvordan er det nu at man laver to kolonner ved siden af hindanden uden at de overlapper hindanden?

Det med at lave de to kolonner og få dem til at være ved siden af hindanden er der styr på, men når jeg vil give kolonerne en padding-værdi vil de overlappe hindanden.

Kan ikke huske hvordan man gør, men synes det er noget med "position".
Avatar billede Slater Ekspert
06. november 2017 - 20:16 #1
Der er mange måder at gøre det, men de mest almindelige er nok float: left; eller display: inline-block;

Men hvordan får du dem dog til at overlappe hinanden?
Avatar billede Slettet bruger
06. november 2017 - 20:22 #2
Eller ned.. de overlapper ikke hindanden, men den ene bliver skubbet ned for at der kan være plads.

Ved den ene boks har jeg sagt "float: left;" og ved den anden har jeg sagt "float: right;"
Avatar billede Slettet bruger
06. november 2017 - 20:23 #3
ned = nej
Avatar billede Slater Ekspert
06. november 2017 - 20:31 #4
Så det du vil have er, at de ikke hopper under hinanden, men altid bliver ved siden af hinanden uanset vinduesstørrelse?
Avatar billede Slettet bruger
06. november 2017 - 20:34 #5
Ja, lige præcis.
Avatar billede Slater Ekspert
06. november 2017 - 20:47 #6
Så giver du dem 50% bredde, for at de hver fylder halvdelen af vinduet. Når du så putter padding på, bliver det lagt oven i, og de falder under hinanden, men det løses ved at give dem box-sizing: border-box; så borders og padding regnes med i bredden, i stedet for at lægges oven i.

Eksempel: https://jsfiddle.net/e7cecn4d/
Avatar billede Slettet bruger
06. november 2017 - 20:49 #7
Fantastisk! Du skal have tak.
Avatar billede Ny bruger Nybegynder

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.

Loading billede Opret Preview

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Bredde på div elementer Af dane022 i HTML 2 16/02/202408:29 20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML 2 21/12/202322:51 22/12/202308:03
validering <input tlfnr. Af slein55 i HTML 5 15/10/202311:43 15/10/202314:51
Link fra form input Af jnrmgs i HTML 9 19/09/202319:10 23/09/202313:11
includere i HTML Af slein55 i HTML 3 15/09/202313:47 16/09/202309:40
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester



Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
41 min siden sletning af en årgang billeder i dropbox Af valsbol i Cloudtjenester
I dag 14:54 Skrive tekst fra celle i formel Af SFrede i Excel
I dag 14:48 skanner Af Dittelit i Andet hardware
I dag 14:26 Opdatering af SAPgrid værdi Af dane022 i Visual Basic
I dag 14:05 Danske karakterter i simpel insert Af boris i MS SQL
White papers
Flere white papers »


Premium
Teaser billede
Om få måneder lægger Microsoft det klassiske Teams i graven
Læs mere »
Danske myndigheder skal slippe alt, hvad de har i hænderne og patche nu: Hackere udnytter alvorlige sårbarheder i Ciscos firewalls
Sådan vil Niras anvende medarbejder-data og AI til løn-regulering og stress-håndtering
BEC varsler prisstigninger for sine kunder: Medarbejderne skal have mere i løn
Se alle »
Computerworld
Teaser billede
På tur i BMW's mægtigste elbil: Sådan er livet ombord i en monumental million-ellert
Læs mere »
Porno-giganterne Pornhub og XVideos skal indlevere materiale til EU
En hyldest til klodens snedigste tablet-design: Nu er fremtiden for Microsofts hardware endnu mere uvis
Nørgaard: Som jeg altid har sagt: Man ansætter altid nye folk på udseendet, for det er det eneste, som en kandidat ikke kan fuske med
Se alle »
CIO
Teaser billede
Nu kan mange flere opgradere deres gamle Windows 10-pc'er til Windows 11: Se om du kan opgradere
Læs mere »
På denne dato er det slut med udbredte versioner af Office: Microsoft vil have dig over på de dyrere E3-licenser
Danske CloudNordic går konkurs efter stort ransomware-angreb
Tidligere Chr. Hansen-CIO Jens Rasmussen løfter sløret efter exit: Her er mit næste skridt i karrieren
Se alle »
Job & Karriere
Teaser billede
NNIT flytter til det centrale København: Her er selskabets nye hovedkvarter
Læs mere »
Knap 40 procent af disse it-folk tjener tjener mindst 57.000 kroner om måneden
Så meget tjener dine kollegaer: Her er alle data fra Computerworlds store it-lønstatistik for 2024
Medarbejderne fik udleveret badetøfler ved indflytningen: Kom med inden for i IBM Danmarks nye topmoderne hovedkontor
Se alle »
White paper
Teaser billede
Guide: Sådan udvikler du en moderne netværksstrategi
Læs mere »
Opdag fordelene ved cloud-baseret backup og recovery
MDR: Transparent sikkerhed og overvågning i realtid
Sæt turbo på din cloudperformance og minimér risikoen for DDoS-angreb
Se alle »

Events
Flere events »
White papers
Flere white papers »
IT-Kurser
Se alle vores it-kurser »