CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

leftism Praktikant

25. marts 2004 - 21:29 Der er 18 kommentarer og
1 løsning

CSS - gå helt ud til kanten!

http://dusted.homepage.dk/index.htm
(stylesheet kan ses på http://dusted.homepage.dk/css.css)

Hvis ovenstående link åbnes i et browservindue som ikke er maksimeret, "trukket" mindre, opstår der et hvidt område yderst til højre. Det er meningen at den gule top og grå navigationsmenu skal gå helt ud til kanten til højre.

Lidt svært at forklare problemet, men prøv at træk vinduet mindre end menu-teksten og du kan se hvad jeg mener.

Det er lidt svært at forklare problemet, men tag evt. et kig på
http://dusted.homepage.dk/css_eksempel.jpg - her er problemet illustreret! =)

Synes godt om

voirsous Nybegynder

25. marts 2004 - 21:35 #1

Jeg ser problemmet. Mit umilbare gæt vil være det kan løses hvis top-div-boksene smides ind med position: absolute; Prøv at rod med det og skriv, hvis det stadigvæk ikke virker.

Synes godt om

bearhugx Nybegynder

25. marts 2004 - 21:35 #2

prøv at drop
width: 100%;

fra din #navigation

Synes godt om

bearhugx Nybegynder

25. marts 2004 - 21:37 #3

et div-element er pr. natur altid hele dokumentets brede (eller den omkredsene boks (containing box)) -- men hvis du specificerer width:100% så bliver bredden sat til browservinduets nuværende bredde - hvorefter den ikke "går hele vejen", når man bruger scroll-barerne...

Synes godt om

voirsous Nybegynder

25. marts 2004 - 21:41 #4

derfor kan du 'hacke' det ved at smide det oven på body elementet, som derfor ikke tager 'skade' når selve sammes width bliver ændret.

<body style="margin: 0px;">
<div style="width: 1005; height: 100px; background-color: blue; position: absolute; left: 0px; top: 0px;">
hack
</div>
<div style="width: 500px;">
bug
</div>

illustrer det vidst

Synes godt om

voirsous Nybegynder

25. marts 2004 - 21:45 #5

1005; = 100%;

Synes godt om

bearhugx Nybegynder

25. marts 2004 - 21:51 #6

voirsous >> man behøver skam ikke at hacke det... man skal bare lade vær med at sætte noget div til
width: xx %
med mindre man rent faktisk har brug for det...

et gammelt ordsprog siger "if it ain't broke, don't fix it..."

Synes godt om

bearhugx Nybegynder

25. marts 2004 - 21:52 #7

derfor vil jeg også opfordre leftism til at droppe det width: 100% som er indsat i #navigation

Synes godt om

leftism Praktikant

25. marts 2004 - 21:55 #8

Voirsous: Hvis jeg tiføjer "position:absolute" til top-div'en, forsvinder denne blot helt og aldeles. Dit hack med at smide det oven på body elementet, bliver udsat for nøjagtig det samme hvide "tomrum" som det oprindelige design...

Synes godt om

leftism Praktikant

25. marts 2004 - 21:56 #9

Bearhuqx: Jeg har prøvet at fjerne width og har også prøvet at sætte den til "auto". Ingen af delene fikser desværre problemet... ='(

Synes godt om

leftism Praktikant

25. marts 2004 - 21:57 #10

Jeg kan godt prøve at smide siderne op med de ændringer I foreslår, hvis det kan hjælpe...!

Synes godt om

voirsous Nybegynder

25. marts 2004 - 22:36 #11

leftis, har du taget højde for min tastefejl?
<div style="width: 1005; <---
skal være
<div style="width: 100%; <---

bearhugx desværre, i de browser klienter jeg ser, er div ikke pr. defination sat til 100%. Jeg vil give dig ret i det burde de egentlig være.

Synes godt om

leftism Praktikant

25. marts 2004 - 22:41 #12

Ja, jeg har taget højde for din tastefejl!

Synes godt om

swuppe Nybegynder

26. marts 2004 - 00:19 #13

Det er din white-space: nowrap; der giver problemet, den hurtige løsning (som jeg lige kan komme på uden at tænke over det :o) er at lægge endnu en div ind i #navigation med en fast bredde og uden baggrund, heri lægger du så menupunkterne. Hvis ikke du kan give den en fast bredde må vi prøve at sætte de små grå i svingninger, men det bliver ikke før i morgen....

Forresten så er vertical-align ikke brugbar på blok elementer, idet den vertikalt justerer inline elementer i forhold til elementerne lige før og efter det element det sættes på, og altså ikke refererer mellem parent og child elementer.

Synes godt om

leftism Praktikant

26. marts 2004 - 17:36 #14

Swuppe: Har prøvet dit forslag, men det løser deværre ikke problemet. Har lagt den op på http://dusted.homepage.dk/index_swuppe.htm, div'en med menupunkterne har en bredde på 1000px og en rød baggrund.

Synes godt om

swuppe Nybegynder

26. marts 2004 - 23:17 #15

jeg kan godt se at der er lidt problemer der, det har jeg faktisk ikke tænkt over før. Nå men her er en mulig løsning (bær venligst over med mig det er fredag aften :oD)

Hvis vi går ud fra dit sidste oplæg.

Sæt #navigation med indhold ind i #top div'en tilføj position:relative; top:101px; left:0; til #navigation og sæt width til 100%; sæt en fast bredde på f.eks. 700px på div'en inde i #navigation.

Det skulle klare det i IE, det virker dog stadigvæk ikke i firefox ved ikke lige med andre browsere, håber du kan bruge det.

Synes godt om

leftism Praktikant

29. marts 2004 - 20:56 #16

Ja, det løser problemet i IE. Jeg fatter bare ikke hvorfor problemet opstår overhovedet. Hvis du laver et indlæg som svar får du de 30 point. Jeg roder selv videre med det for at se om jeg kan finde en løsning så det også virker i bl.a. Firefox. Men tak for IE hjælpen.

Synes godt om

swuppe Nybegynder

30. marts 2004 - 10:27 #17

S'gerne :o)

Problemet opstår fordi width=100% relaterer sig til den omgivende boks i dette tilfælde browservinduet, i IE fungerer width som min-width derfor kan vi løse problemet ved at sætte menuen ind i top boksen.

Måske vil det fungere i netscape/mozilla (hvis ikke det allerede gør har ikke testet) ved at tilføje en "spacer" div <div style="clear:both"></div> efter #navigation i css2 kan du også benytte dig af ren css til at opnå samme effekt #navigation:after{ content: ""; display: block; height: 0; clear: both; }, det er måske værd at prøve.

Synes godt om

leftism Praktikant

30. marts 2004 - 18:54 #18

Dit første forslag virker i Firefox, men har endnu ikke prøvet forslag 2 - men vil selvfølgelig afprøve det.

Er sgu lidt skuffet over at css (eller hvad det nu er) laver sådan et rod... ;-)

Synes godt om

leftism Praktikant

30. marts 2004 - 18:54 #19

Iøvrigt; tak for hjælpen alle sammen!

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

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.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS