Dark Prince Posted October 5, 2011 Share Posted October 5, 2011 ok I'm trying to find away to eliminate the bleeding effect of no spaces when entered into a database and being returned into a table. eg. say someone for the hell of it uses no spaces for a very long string, when returned in a table it bleeds the page for that cell. I've tried using width controls with percent values in the html td tags still bleeds. I want my pages to fit exactly inside the browser window with no horizontal scroll bars I use 1% margin on my main body content in css like margin:1% 1% 1% 1%; and in the tag its like this <td align="center" width="25"%> </td> so if someone enters a run-on word into an input field it doesn't break it for the td's width it stretches it right to the end of the run-on word. ??????? Link to comment Share on other sites More sharing options...
Dark Prince Posted October 5, 2011 Author Share Posted October 5, 2011 also I am having another slight problem thats been annoying me the same said table is showing at the bottom of the page when it should be the 3rd last div on that page meaning even my footer box shows above it???? Link to comment Share on other sites More sharing options...
Josee Posted October 5, 2011 Share Posted October 5, 2011 As for your first question, it depends on how long is your very long string with no spaces. For instance, these two layouts work with not too long strings. But if you test them with strings twice or three times longer in the third column, it won't work, for apparently browsers don't know how to break a string with no spaces at all. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Table</title> <style type="text/css" media="all"> table tr td, table tr th { border: 1px solid gray; padding: 10px; } table.shrinkwrap { table-layout: auto; width: auto; border-collapse: collapse; } table.fixedwidth { table-layout: auto; width: 700px; border-collapse: collapse; } table tr td.auto-width { width: auto; } table.fixedwidth tr td.col100 {width: 100px; } </style> </head> <body> <table class="shrinkwrap"> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3 long string</th> </tr> <tr> <td class="auto-width">this and that and the other</td> <td class="auto-width">00301020</td> <td class="auto-width">Loremipsumdolorsitamet,consectetueradipiscingelit,seddiamnonummynibheuis.</td> </tr> </table> <hr /> <table class="fixedwidth"> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3 long string</th> </tr> <tr> <td class="col100">this and that and the other</td> <td class="col100">00301020</td> <td class="auto-width">Loremipsumdolorsitamet,consectetueradipiscingelit,seddiamnonummynibheuis.</td> </tr> </table> </body> </html> Link to comment Share on other sites More sharing options...
abigail Posted October 6, 2011 Share Posted October 6, 2011 I'm not an html expert, for sure, but these are the ideas I have, in case I had such a problem, what I would try. For the bleeding, maybe you could try to place the text inside of some other entity. Such as a text editor box (maybe even a form textarea). Think of an application that would handle the text for you. Otherwise, probably the only thing you can do is parse it yourself and break it with spaces. (Think like the html program 'thinks'. It expects to see 'ordinary' things. It doesn't try to handle everything and anything but it tries to deal well with the usual and common.) For your second problem, you should test this when you have no bleeding text. The bleeding text and certain other errors will cause very odd placement of other sections on the page. Link to comment Share on other sites More sharing options...
Paul Swanson Posted October 6, 2011 Share Posted October 6, 2011 Try applying the overflow:hidden style to your table cell to counteract the bleeding. Link to comment Share on other sites More sharing options...
Jonathon Posted October 6, 2011 Share Posted October 6, 2011 I would have suggest overflow:hidden too, but I've never used it in tables, but It's certainly helpful in div containing elements - Good luck Link to comment Share on other sites More sharing options...
Dark Prince Posted October 19, 2011 Author Share Posted October 19, 2011 even without the bleeding the footer still shows above the last 2 div blocks, and in my stylesheet the footer's styling is the last thing run, still don't understand why its doing it it should be a table of comments, then a textarea to add a comment and then the end of the body content then the footer. instead it goes footer, comments, commentbox. as for the bleeding again is there a way to do a preg match and check for no spaces in $_POST? or even simpler just check to see if no spaces exist in the field at all? Link to comment Share on other sites More sharing options...
abigail Posted October 19, 2011 Share Posted October 19, 2011 For your footer, are you using clear in your css? This is what I use: #footer { clear: both; padding: 10px 20px; background: #fcf; /* pale weak magenta */ } If that's not it, maybe I have to see what it looks like. Link to comment Share on other sites More sharing options...
Antonio Conte Posted October 19, 2011 Share Posted October 19, 2011 How about something simple like strlen()? No need to over-complicate things. Match the total so it does not bleed. Link to comment Share on other sites More sharing options...
Recommended Posts