javascript - How can I make a <div> contain HTML response that could be anything? -
my application has screen can utilize check response bodies api calls. entering in url , clicking execute response body of html appears within div in web page.
however info appears bigger fit in <div> happens appears outside of <div>. have tried contain setting
<div style="height: 40rem; width: 70rem; overflow: auto;"> html page here </div> and
<div style="height: 40rem; width: 70rem; overflow: scroll;"> html page here </div> this not contain contents of <div>
how can create contents of <div> contained , appear scroll-bars? note not looking jquery solution.
note each page coming server has next style added automatically page. it's standard style appear on every asp.net error page.
i wondering if solution override here or if there parts of style should somehow remove:
<!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"> <head> <title>iis 8.0 detailed error - 404.0 - not found</title> <style type="text/css"> <!-- body{margin:0;font-size:.7em;font-family:verdana,arial,helvetica,sans-serif;} code{margin:0;color:#006600;font-size:1.1em;font-weight:bold;} .config_source code{font-size:.8em;color:#000000;} pre{margin:0;font-size:1.4em;word-wrap:break-word;} ul,ol{margin:10px 0 10px 5px;} ul.first,ol.first{margin-top:5px;} fieldset{padding:0 15px 10px 15px;word-break:break-all;} .summary-container fieldset{padding-bottom:5px;margin-top:4px;} legend.no-expand-all{padding:2px 15px 4px 10px;margin:0 0 0 -12px;} legend{color:#333333;;margin:4px 0 8px -12px;_margin-top:0px; font-weight:bold;font-size:1em;} a:link,a:visited{color:#007eff;font-weight:bold;} a:hover{text-decoration:none;} h1{font-size:2.4em;margin:0;color:#fff;} h2{font-size:1.7em;margin:0;color:#cc0000;} h3{font-size:1.4em;margin:10px 0 0 0;color:#cc0000;} h4{font-size:1.2em;margin:10px 0 5px 0; }#header{width:96%;margin:0 0 0 0;padding:6px 2% 6px 2%;font-family:"trebuchet ms",verdana,sans-serif; color:#fff;background-color:#5c87b2; }#content{margin:0 0 0 2%;position:relative;} .summary-container,.content-container{background:#fff;width:96%;margin-top:8px;padding:10px;position:relative;} .content-container p{margin:0 0 10px 0; }#details-left{width:35%;float:left;margin-right:2%; }#details-right{width:63%;float:left;overflow:hidden; }#server_version{width:96%;_height:1px;min-height:1px;margin:0 0 5px 0;padding:11px 2% 8px 2%;color:#ffffff; background-color:#5a7fa5;border-bottom:1px solid #c1cfdd;border-top:1px solid #4a6c8e;font-weight:normal; font-size:1em;color:#fff;text-align:right; }#server_version p{margin:5px 0;} table{margin:4px 0 4px 0;width:100%;border:none;} td,th{vertical-align:top;padding:3px 0;text-align:left;font-weight:normal;border:none;} th{width:30%;text-align:right;padding-right:2%;font-weight:bold;} thead th{background-color:#ebebeb;width:25%; }#details-right th{width:20%;} table tr.alt td,table tr.alt th{} .highlight-code{color:#cc0000;font-weight:bold;font-style:italic;} .clear{clear:both;} .preferred{padding:0 5px 2px 5px;font-weight:normal;background:#006633;color:#fff;font-size:.8em;} --> </style> </head> <body> <div id="content"> <div class="content-container"> <h3>http error 404.0 - not found</h3> <h4>the resource looking has been removed, had name changed, or temporarily unavailable.</h4> </div> <div class="content-container"> <fieldset><h4>most causes:</h4> <ul> <li>the directory or file specified not exist on web server.</li> <li>the url contains typographical error.</li> <li>a custom filter or module, such urlscan, restricts access file.</li> </ul> </fieldset> </div> <div class="content-container"> <fieldset><h4>things can try:</h4> <ul> <li>create content on web server.</li> <li>review browser url.</li> <li>check failed request tracing log , see module calling setstatus. more information, click <a href="http://go.microsoft.com/fwlink/?linkid=66439">here</a>. </li> </ul> </fieldset> </div> <div class="content-container"> <fieldset><h4>detailed error information:</h4> <div id="details-left"> <table border="0" cellpadding="0" cellspacing="0"> <tr class="alt"><th>module</th><td> iis web core</td></tr> <tr><th>notification</th><td> maprequesthandler</td></tr> <tr class="alt"><th>handler</th><td> staticfile</td></tr> <tr><th>error code</th><td> 0x80070002</td></tr> </table> </div> <div id="details-right"> <table border="0" cellpadding="0" cellspacing="0"> <tr class="alt"><th>requested url</th><td> http://127.0.0.1:17315/api/test</td></tr> <tr><th>physical path</th><td> c:\k\webrole1\api\test</td></tr> <tr class="alt"><th>logon method</th><td> anonymous</td></tr> <tr><th>logon user</th><td> anonymous</td></tr> <tr class="alt"><th>request tracing directory</th><td> c:\users\richard\appdata\local\dftmp\resources\c841e747-89a0-46a2-87fc-450674d1b67b\directory\diagnosticstore\failedreqlogfiles\web\deployment23(430).webrole1_in_0_web</td></tr> </table> <div class="clear"></div> </div> </fieldset> </div> <div class="content-container"> <fieldset><h4>more information:</h4> error means file or directory not exist on server. create file or directory , seek request again. <p><a href="http://go.microsoft.com/fwlink/?linkid=62293&iis70error=404,0,0x80070002,7601">view more info »</a></p> </fieldset> </div> </div> </body> </html>
give div
overflow: scroll here's example: http://jsfiddle.net/an925/
javascript html css
No comments:
Post a Comment