html - Text Jumping out of the Column -
i have script it's script allow me edit database tables through web. works perfect except if column has large word without space between u can see if u open link of script posted, it's jumping on column next it... been messing css , whole codes of script couldn't thing fixed...
those codes...
my css code :
body{ margin-top: 0px; margin-left: 0px; font-family:tahoma, geneva, sans-serif; font-size:14px; } .dgerror{ margin-top:10px; margin-left:10px; font-family:verdana, arial, helvetica, sans-serif; font-size:12px; color:#000000; background-color:#efefef; border:5px double #c0c0c0; padding:5px; } .dgmaindiv{ width:98%; } .dgtable{ font-family:verdana, arial, helvetica, sans-serif; font-size:95%; width:100%; background-color:#ffffff; } .dgtitles{ font-size:105%; font-weight:bold; background-color:#dcdcdc; border:1px solid; border-left-color:#ffffff; border-right-color:#aca899; border-top-color:#ece9d8; border-top-width:2px; border-bottom-color:#ece9d8; } .dgtitles:hover{ border-top-color:#ffc83c; } .dgimglink{ cursor:pointer; padding:2px; } .dgimglink:hover{ background-color:#cccccc; } .dgheader{ font-size:110%; font-weight:bold; background-color:#c0c0c0; border:solid 1px #a0a0a0; height:30px; } .dgfooter{ font-size:9px; background-color:#efefef; color:#000000; } .dgpagrow{ background:#efefef; border-top:solid 1px #bfcacd; font-size:9px; } .dgbold{ font-weight:bold; } .dglinks{ cursor:pointer; text-decoration:underline; color:#0000ff; } .dglinks:hover{ color:#ff0000; } .dgselectpage{ color:#000000; font-size:9px; font-weight:bold; } .dgrownorm{ font-size:100%; border:1px solid #bfcacd; border-left-color:#ffffff; border-bottom-style:none; } .dgrowalt{ font-size:100%; border:1px solid #bfcacd; border-left-color:#ffffff; border-bottom-style:none; } .dgrowsnormtr, .dgspnormrow{ height:20px; background-color:#ffffff; color:#000000; } .dgrowsnormtr:hover{ background-color:#ffffe0; } .dgrowsalttr, .dgspaltrow{ height:20px; background-color:#e9eff2; color:#000000; } .dgrowsalttr:hover{ background-color:#ffffe0; } .dgspnormrow{ font-weight:bold; } .dgspaltrow{ font-weight:bold; } .dgajax{ font-family:verdana, arial, helvetica, sans-serif; font-size:12px; font-weight:bold; background-color:#ffffe1; border-style: dotted; border-width: 2px; padding: 4px; } .dgarrows{ width:5px; height:15px; } .dginput { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px; border: 1px solid #6699ff; padding-left: 4px; padding-right: 4px; padding-top: 1px; padding-bottom: 1px; } .dginput:focus{ background-color: lightyellow; } .dgsearchdiv { font-family:verdana, arial, helvetica, sans-serif; position: absolute; width:300px; height: 150px; background-color:#0a246a; border:2px solid #0a246a; top:0; z-index: 10000; display:none; } .dginnerdiv { font-family:verdana, arial, helvetica, sans-serif; margin-top:20px; background-color:#d9d9d9; font-size:100%; height:130px; } .dgsearchtit { width:270px; color:#ffffff; font-size:12px; font-weight:bold; padding-left:10px; cursor:move; float:left; } .dgcheck{ width: 17px; border: 1px solid #6699ff; } .dgtotrowstr{ height:25px; background-color:#ece9d8; color:#000000; font-weight:bold; } .dgrowstot{ border:1px solid #bfcacd; border-left-color:#ffffff; } .dgadddiv{ position:absolute; top: 0px; left: 0px; /* --- options below produce error in ff 3 --- */ /* opacity: .98; -moz-opacity:0.98; */ color:#ffffff; } .dgaddtitle{ background-color: #000099; height:20px; font-weight:bold; } .dgaddnames{ width: 200px; font-weight:bold; } .dgaddinputs{ width: 180px; } .dgaddbutons{ height:30px; vertical-align:middle; background-color: #ccc; } main page code = http://pastebin.com/44qgpeti
php script code = http://pastebin.com/lqavqhdx
i posted both css , script in case problem not in css file...
so i'm hoping me find problem :)
you can use css word-wrap split words extremely large:
.dgrownorm { border-style: solid solid none; font-size: 100%; word-wrap: break-word; } you can check browser compatibility table here @ mdn.
Comments
Post a Comment