Overflow-problem ved udskrift fra database

Tags:    overflow css php mysql

Hey.

Jeg har et problem med noget css kode.

Jeg har lavet en sql-forespørgsel og et fetch_array der udskriver 10 værdier.
Disse værdier står på linje med hinanden såsom:
[værdi 1] [værdi 2] [værdi 3] [værdi 4] [værdi 5] [værdi 6] [værdi 7]...

Problemet er blot at der kun er plads til 6 af boksene der hvor de skal være på siden.

Derfor tænkte jeg at jeg nemt fixer den med noget overflow-x: scroll; overflow-y: hidden;

Der hvor problemet ligger, er bare at overflow-x ikke virker. Scrollbaren kommer frem - men den kan ikke køre fra side til siden.
Detter resulterer i at værdierne udskrives som følger:
[værdi 1][værdi 2][værdi 3][værdi 4][værdi 5][værdi 6]
[værdi 7][værdi 8][værdi 9][værdi 10]

Fetch_array'et ligger i et div kaldet printArea

Hvordan løser jeg dette?
CSS-kode:
Fold kodeboks ind/udCSS kode 


SQL og PHP
Fold kodeboks ind/udPHP kode 




6 svar postet i denne tråd vises herunder
1 indlæg har modtaget i alt 1 karma
Sorter efter stemmer Sorter efter dato
Nu er der jo også ekstrem stor forskel på en linje tekst der ikke må brydes, og elementer med float:left. :)

Som du selv kan se, den kode jeg skrev virker upåklageligt. Men et element med float falder for bredden på det forrige element. Den eneste umiddelbare løsning er, at du lægger et wrapper element, som har en bredde der passer til det antal elementer du har liggende:
Fold kodeboks ind/udKode 




Indlæg senest redigeret d. 14.04.2012 11:19 af Bruger #10216
Du kan bruge css:
white-space: nowrap

http://www.w3schools.com/cssref/pr_text_white-space.asp



Negativ.

Hvis jeg bruger nowrap udskriver den desværre præcis som før.
Altså [værdi] på to rækker



Så har du skrevet forkert:

Fold kodeboks ind/udKode 




Nej.

Jeg er helt med på at det fungerer sådan med tekst.

Problemet her er at jeg henter værdierne fra et fetch_array - og at det åbenbart ødelægger det..

jeg har lavet et eksempel hvor jeg har brugt præcis samme div til at omslutte henholdsvis array'et og så normal html tekst.

http://iye.dk/posttest.php

div'et der omslutter hedder printArea og har følgende css-kode

#printArea {
width: 500px;
white-space: nowrap;
overflow-x: scroll;
height: 60px;
}



Nu virker det upåklageligt!

Jeg takker for hjælpen!

Til interesserede ser koden nu således ud:

Fold kodeboks ind/udPHP kode 




t