Question

I am having a weird problem with CSS.

I am trying to achieve the following.
I can have people search for a name or a part of a quote in a database and I would like to display this into a box (in this case a form ,which is easy for styling).
Problem is, the total box should have a gradient green color, but not the entire fetched data is retrieved with a green layout.

I have debugged and it seems to work just great:
I have both echo and alerted my output and it is just a normal form with table rows in it..

Here’s the result outcome:
pastebin.com/AZAv6bpX (broken)

Here’s my css:
pastebin.com/NATwyki6 (broken)

Here’s what it looks like:

Notice the table rows still continue-ing after the gradient has stopped.

I have adjusted the table entry margins, for the div (results) they are placed in. So I am 100% sure the outcome is as I want it.

So basically I got:

code from pastebin here

And this weird layout.

Can anybody please help me out?

Answer 1

Either take your float:left off of your table or set overflow:auto on your form.
jsfiddle link