Databases
StackOverflow2013
Postsdbo
POStrange border on fixed postition elements in firefox 7.0.1
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POStrange border on fixed postition elements in firefox 7.0.1
    primarykey
    data
    text
    <p>There is a strange border on my fixed header and footer elements in firefox..</p> <p>Does anyone know how to get rid of this or is it a bug?</p> <p><img src="https://i.stack.imgur.com/4zDTI.jpg" alt="Firefox error"></p> <p><img src="https://i.stack.imgur.com/3D9SF.jpg" alt="enter image description here"></p> <p><img src="https://i.stack.imgur.com/mXXLs.jpg" alt="enter image description here"></p> <p><strong>HTML</strong> This is the html for the home page..</p> <pre><code>&lt;!doctype html&gt; &lt;!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ --&gt; &lt;!--[if lt IE 7]&gt; &lt;html class="no-js ie6 oldie" lang="en"&gt; &lt;![endif]--&gt; &lt;!--[if IE 7]&gt; &lt;html class="no-js ie7 oldie" lang="en"&gt; &lt;![endif]--&gt; &lt;!--[if IE 8]&gt; &lt;html class="no-js ie8 oldie" lang="en"&gt; &lt;![endif]--&gt; &lt;!-- Consider adding an manifest.appcache: h5bp.com/d/Offline --&gt; &lt;!--[if gt IE 8]&gt;&lt;!--&gt; &lt;html class="no-js" lang="en"&gt; &lt;!--&lt;![endif]--&gt;&lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;!-- Use the .htaccess and remove these lines to avoid edge case issues. More info: h5bp.com/b/378 --&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"&gt; &lt;title&gt;my Sitelocker!&lt;/title&gt; &lt;meta name="description" content=""&gt; &lt;meta name="author" content=""&gt; &lt;base href="http://sitelocker.local/" /&gt; &lt;!-- Mobile viewport optimized: j.mp/bplateviewport --&gt; &lt;meta name="viewport" content="width=device-width,initial-scale=1"&gt; &lt;!-- Place favicon.ico and apple-touch-icon.png in the root directory: mathiasbynens.be/notes/touch-icons --&gt; &lt;!-- CSS: implied media=all --&gt; &lt;!-- CSS concatenated and minified via ant build script--&gt; &lt;link rel="stylesheet" type="text/css" href="resource/css/grid.css"/&gt; &lt;!--[if IE 6]&gt;&lt;link rel="stylesheet" type="text/css" href="resource/css/ie6.css" /&gt;&lt;![endif]--&gt; &lt;!--[if IE 7]&gt;&lt;link rel="stylesheet" type="text/css" href="resource/css/ie.css" /&gt;&lt;![endif]--&gt; &lt;link rel="stylesheet" type="text/css" href="resource/css/style.css"&gt; &lt;link rel="stylesheet" type="text/css" href="resource/css/uniform.default.css"&gt; &lt;link href='http://fonts.googleapis.com/css?family=Yellowtail' rel='stylesheet' type='text/css'&gt; &lt;link href='http://fonts.googleapis.com/css?family=Bangers' rel='stylesheet' type='text/css'&gt; &lt;link type="text/css" rel="stylesheet" href="resource/css/smoothness/jquery-ui-1.8.2.custom.css" /&gt; &lt;!-- end CSS--&gt; &lt;!-- More ideas for your &lt;head&gt; here: h5bp.com/d/head-Tips --&gt; &lt;!-- All JavaScript at the bottom, except for Modernizr / Respond. Modernizr enables HTML5 elements &amp; feature detects; Respond is a polyfill for min/max-width CSS3 Media Queries For optimal performance, use a custom Modernizr build: www.modernizr.com/download/ --&gt; &lt;script src="resource/js/libs/modernizr-2.0.6.min.js"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;header id="masthead" class="clearfix"&gt; &lt;div id="masthead-inner" class="container_12 clearfix"&gt; &lt;div id="logo" class="grid_6"&gt; &lt;img src="resource/img/logo.jpg"/&gt; &lt;/div&gt;&lt;!--/#logo--&gt; &lt;div id="tools" class="grid_6"&gt; &lt;a href="#" id="add-site-modal"&gt;Add Site&lt;/a&gt; &lt;ul id="top_menu"&gt; &lt;li&gt;Welcome, &lt;strong&gt;lemonfreshdesign&lt;/strong&gt;.&lt;/li&gt; &lt;li&gt;&lt;a href="http://sitelocker.local/account/account_settings"&gt;Account&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="http://sitelocker.local/account/sign_out"&gt;Sign out&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt;&lt;!--/#top_menu--&gt; &lt;/div&gt;&lt;!--/#tools--&gt; &lt;/div&gt;&lt;!--/#masthead-inner--&gt; &lt;/header&gt;&lt;!--/#masthead--&gt; &lt;div id="main" role="main" class="container_12 clearfix"&gt; &lt;div id="main_inner"&gt; &lt;div id="ajaxLoadAni"&gt; &lt;img src="resource/img/ajax-loader.gif" alt="Ajax Loading Animation" /&gt; &lt;span&gt;Loading...&lt;/span&gt; &lt;/div&gt;&lt;!--/#ajaxLoadAni--&gt; &lt;div id="siteholder" class="column grid_12 clearfix"&gt; &lt;/div&gt;&lt;!--/#siteholder--&gt; &lt;div id="delConfDialog" title="Confirm"&gt; &lt;p&gt;Are you sure?&lt;/p&gt; &lt;/div&gt;&lt;!--/#siteholder--&gt; &lt;div id="msgDialog"&gt; &lt;p&gt;&lt;/p&gt; &lt;/div&gt;&lt;!--/#siteholder--&gt; &lt;div id="myModal" class="reveal-modal"&gt; &lt;form action="http://sitelocker.local/usersites/insert_site" method="post" accept-charset="utf-8" class="addsite_form"&gt; &lt;input id="account_id" type="hidden" value="1"/&gt; &lt;label for="site_title"&gt;&lt;strong&gt;Site Name:&lt;/strong&gt;&lt;/label&gt; &lt;input id="site_title" type="text" maxLength="25" tabindex="1" name="site_title" /&gt; &lt;label for="site_url"&gt;&lt;strong&gt;Site Address:&lt;/strong&gt;&lt;/label&gt; &lt;input id="site_url" type="text" tabindex="2" name="site_url" /&gt; &lt;label for="site_description"&gt;&lt;strong&gt;Site Description:&lt;/strong&gt;&lt;/label&gt; &lt;input id="site_description" type="text" tabindex="3" name="site_description" /&gt; &lt;label for="site_category"&gt;&lt;strong&gt;Site Category:&lt;/strong&gt;&lt;/label&gt; &lt;input id="site_category" type="text" tabindex="4" name="site_category" /&gt; &lt;input id="addsite_form_submit" type="submit" value="Add Site" name="submit" class="addsite_form_submit" tabindex="5" /&gt; &lt;/form&gt; &lt;/div&gt;&lt;!--/#myModal--&gt; &lt;/div&gt;&lt;!--/#main_inner --&gt; &lt;/div&gt;&lt;!--/#main --&gt; &lt;footer id="footer" class="clearfix"&gt; &lt;div id="footer-container" class="container_12 clearfix"&gt; &lt;div id="copyright" class="grid_4"&gt; &amp;copy; my SiteLocker 2011 | All Rights Reserved &lt;/div&gt;&lt;!--/#copyright --&gt; &lt;div id="benchmarking" class="grid_4"&gt; Page rendered in 0.0533 seconds &lt;/div&gt;&lt;!--/#benchmarking --&gt; &lt;div id="category-select" class="grid_4"&gt; &lt;form&gt; &lt;select style="opacity: 0;"&gt; &lt;option value="option1"&gt;Category&lt;/option&gt; &lt;option value="option2"&gt;Option 2&lt;/option&gt; &lt;option value="option3"&gt;Option 3&lt;/option&gt; &lt;/select&gt; &lt;/form&gt; &lt;/div&gt;&lt;!--/#category-select --&gt; &lt;/div&gt;&lt;!--/#footer-container --&gt; &lt;/footer&gt;&lt;!--/#footer --&gt; &lt;!-- JavaScript at the bottom for fast page loading --&gt; &lt;!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline --&gt; &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"&gt;&lt;/script&gt; &lt;script&gt;window.jQuery || document.write('&lt;script src="resource/js/libs/jquery-1.6.2.min.js"&gt;&lt;\/script&gt;')&lt;/script&gt; &lt;!-- scripts concatenated and minified via ant build script--&gt; &lt;script defer src="resource/js/libs/jquery-ui-1.7.2.custom.min.js"&gt;&lt;/script&gt; &lt;script defer src="resource/js/plugins.js"&gt;&lt;/script&gt; &lt;script type="text/template" id="readTemplate"&gt; &lt;div class="scroll-content-item dragbox clearfix" id="dragbox${site_id}"&gt; &lt;h2 class="h2handle"&gt;&lt;a href="${site_url}"&gt;${site_title}&lt;/a&gt;&lt;span class="close"&gt;&lt;a href="http://sitelocker.local/usersites/delete_site/${site_id}" id="${site_id}" class="deleteBtn"&gt;&lt;img src="resource/img/closepanel.png"&gt;&lt;/a&gt;&lt;/span&gt;&lt;/h2&gt; &lt;div class="dragbox-content"&gt; &lt;p&gt;&lt;a class="sitelink" href="${site_url} ?&gt;" title="${site_title}"&gt;&lt;img src="http://immediatenet.com/t/l?Size=1024x768&amp;URL=${site_url}" alt="${site_title}" title="${site_title}"/&gt;&lt;/a&gt;&lt;/p&gt; &lt;/div&gt; &lt;div class="dragbox-footer"&gt; &lt;p&gt;in: ${site_category}&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; &lt;/script&gt; &lt;script defer src="resource/js/script.js"&gt;&lt;/script&gt; &lt;script&gt; //display ajax loader animation $( '#ajaxLoadAni' ).fadeIn( 'slow' ); $('a#viewqr').click(function(e) { e.preventDefault(); $('div#qr').reveal({ animation: 'fadeAndPop', //fade, fadeAndPop, none animationspeed: 300, //how fast animtions are closeonbackgroundclick: true, //if you click background will modal close? }); }); &lt;/script&gt; &lt;!-- end scripts--&gt; &lt;!-- Change UA-XXXXX-X to be your site's ID --&gt; &lt;script&gt; window._gaq = [['_setAccount','UAXXXXXXXX1'],['_trackPageview'],['_trackPageLoadTime']]; Modernizr.load({ load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js' }); &lt;/script&gt; &lt;!-- Prompt IE 6 users to install Chrome Frame. Remove this if you want to support IE 6. chromium.org/developers/how-tos/chrome-frame-getting-started --&gt; &lt;!--[if lt IE 7 ]&gt; &lt;script src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"&gt;&lt;/script&gt; &lt;script&gt;window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})&lt;/script&gt; &lt;![endif]--&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p><strong>CSS</strong> This is the main layout css file for the main page</p> <pre><code>/* * HTML5 ✰ Boilerplate * * What follows is the result of much research on cross-browser styling. * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, * Kroc Camen, and the H5BP dev community and team. * * Detailed information about this CSS: h5bp.com/css * * ==|== normalize ========================================================== */ /* ============================================================================= HTML5 display definitions ========================================================================== */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } [hidden] { display: none; } /* ============================================================================= Base ========================================================================== */ /* * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units * 2. Force vertical scrollbar in non-IE * 3. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g */ html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { margin: 0; font-size: 13px; line-height: 1.231; } body, button, input, select, textarea { font-family: sans-serif; color: #222; } /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection declarations have to be separate * Also: hot pink! (or customize the background color to match your design) */ ::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; } ::selection { background: #fe57a1; color: #fff; text-shadow: none; } /* ============================================================================= Links ========================================================================== */ a { color: #00e; } a:visited { color: #551a8b; } a:hover { color: #06e; } a:focus { outline: thin dotted; } /* Improve readability when focused and hovered in all browsers: h5bp.com/h */ a:hover, a:active { outline: 0; } /* ============================================================================= Typography ========================================================================== */ abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } blockquote { margin: 1em 40px; } dfn { font-style: italic; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } ins { background: #ff9; color: #000; text-decoration: none; } mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; } /* Redeclare monospace font family: h5bp.com/j */ pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; } /* Improve readability of pre-formatted text in all browsers */ pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } q { quotes: none; } q:before, q:after { content: ""; content: none; } small { font-size: 85%; } /* Position subscript and superscript content without affecting line-height: h5bp.com/k */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ============================================================================= Lists ========================================================================== */ ul, ol { margin: 1em 0; padding: 0 0 0 40px; } dd { margin: 0 0 0 40px; } nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; } /* ============================================================================= Embedded content ========================================================================== */ /* * 1. Improve image quality when scaled in IE7: h5bp.com/d * 2. Remove the gap between images and borders on image containers: h5bp.com/e */ img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; } /* * Correct overflow not hidden in IE9 */ svg:not(:root) { overflow: hidden; } /* ============================================================================= Figures ========================================================================== */ figure { margin: 0; } /* ============================================================================= Forms ========================================================================== */ form { margin: 0; } fieldset { border: 0; margin: 0; padding: 0; } /* Indicate that 'label' will shift focus to the associated form element */ label { cursor: pointer; } /* * 1. Correct color not inheriting in IE6/7/8/9 * 2. Correct alignment displayed oddly in IE6/7 */ legend { border: 0; *margin-left: -7px; padding: 0; } /* * 1. Correct font-size not inheriting in all browsers * 2. Remove margins in FF3/4 S5 Chrome * 3. Define consistent vertical alignment display in all browsers */ button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; } /* * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet) * 2. Correct inner spacing displayed oddly in IE6/7 */ button, input { line-height: normal; *overflow: visible; } /* * Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7 */ table button, table input { *overflow: auto; } /* * 1. Display hand cursor for clickable form elements * 2. Allow styling of clickable form elements in iOS */ button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; } /* * Consistent box sizing and appearance */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; } input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /* * Remove inner padding and border in FF3/4: h5bp.com/l */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* * 1. Remove default vertical scrollbar in IE6/7/8/9 * 2. Allow only vertical resizing */ textarea { overflow: auto; vertical-align: top; resize: vertical; } /* Colors for form validity */ input:valid, textarea:valid { } input:invalid, textarea:invalid { background-color: #f0dddd; } /* ============================================================================= Tables ========================================================================== */ table { border-collapse: collapse; border-spacing: 0; } td { vertical-align: top; } /* ==|== primary styles ===================================================== Author: ========================================================================== */ body { background:url(../img/background.png) repeat; font-size:100%; } /* ============================================================================= header ========================================================================== */ #masthead { background: url(../img/header.gif) repeat-x; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 1); -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 1); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 1); height:54px; position:fixed; width:100%; top:0; z-index:1000; text-shadow: 1px 1px 2px #000000; filter: dropshadow(color=#000000, offx=1, offy=1); } /*------------------------------------------------------------------------------*/ #logo { height:54px; line-height:50px; } #logo img { padding:0px 15px 0px 0; background: url(../img/header-sep.png) no-repeat right; } /*------------------------------------------------------------------------------*/ #tools { text-align:right; } #tools ul { float:right; } #tools ul li { display:inline; } /* ============================================================================= main ========================================================================== */ #main .dragbox{ margin:20px 15px; padding:10px; width:207px; background-color: rgba(0, 0, 0, .2); position:relative; border:1px solid #4e4e4e; -webkit-box-shadow: 0px 0px 10px 0px #000000; -moz-box-shadow: 0px 0px 10px 0px #000000; box-shadow: 0px 0px 10px 0px #000000; float:left; } /*------------------------------------------------------------------------------*/ #main .dragbox h2 { border-bottom: 1px solid #CCCCCC; font-size: .8em; padding: 0; margin: 0; background: #7b7b7b; /* Old browsers */ background: -moz-linear-gradient(top, #515151 0%, #303030 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#515151), color-stop(100%,#303030)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #515151 0%,#303030 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #515151 0%,#303030 100%); /* Opera11.10+ */ background: -ms-linear-gradient(top, #515151 0%,#303030 100%); /* IE10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#303030',GradientType=0 ); /* IE6-9 */ background: linear-gradient(top, #515151 0%,#303030 100%); /* W3C */ padding: 0px 12px; cursor: move; font-family:'cabin'; border-top: thin solid #777777; border-left: thin solid rgba(255, 255, 255, .25); border-right: thin solid rgba(255, 255, 255, .25); border-bottom:solid thin #1a1a1a; text-shadow: 1px 1px 0px #606060; color:#000000; font-weight:bold; text-transform:uppercase; line-height:2.4em; } #main .dragbox h2 a { text-decoration:none; color:#000000; } #main .dragbox h2 a:hover { text-shadow: 1px 1px 0px rgba(0, 0, 0, 1); color:#aadb02; } #main .dragbox h2 span.close { float:right; } /*------------------------------------------------------------------------------*/ .dragbox-content{ background:#fff; min-height:100px; border-left: 1px solid #a3a3a3; border-right: 1px solid #a3a3a3; } .dragbox-content p { margin:0; } /*------------------------------------------------------------------------------*/ #main .dragbox-footer { border-bottom: 1px solid #CCCCCC; font-size: 0.8em; padding: 0; margin: 0; background: #7b7b7b; /* Old browsers */ background: -moz-linear-gradient(top, #7b7b7b 0%, #4d4d4d 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7b7b7b), color-stop(100%,#4d4d4d)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #7b7b7b 0%,#4d4d4d 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #7b7b7b 0%,#4d4d4d 100%); /* Opera11.10+ */ background: -ms-linear-gradient(top, #7b7b7b 0%,#4d4d4d 100%); /* IE10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7b7b7b', endColorstr='#4d4d4d',GradientType=0 ); /* IE6-9 */ background: linear-gradient(top, #7b7b7b 0%,#4d4d4d 100%); /* W3C */ padding: 6px 12px; cursor: move; font-family:'cabin'; border-bottom: thin solid rgba(255, 255, 255, .25); border-left: thin solid rgba(255, 255, 255, .25); border-right: thin solid rgba(255, 255, 255, .25); border-top:none; text-shadow: 1px 1px 0px rgba(255, 255, 255, .25); color:#0c0c0c; font-weight:normal; } #main .dragbox-footer p { margin:0; } /*------------------------------------------------------------------------------*/ #ajaxLoadAni { background: #3A3A3A; color: #fff; display: none; font-weight: bold; position: fixed; top: 0; left: 40%; padding: 8px; width: 106px; z-index: 9999; } #ajaxLoadAni span { float: right; margin: 2px 0 0 0; } /*------------------------------------------------------------------------------*/ .ui-widget-content { font-size: .8em; } #delConfDialog, #msgDialog { font-size: 1em; } /* ============================================================================= footer ========================================================================== */ footer { background:url(../img/footer.png) repeat-x; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 1); -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 1); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 1); position:fixed; bottom:0; z-index:1000; height:75px; width:100%; } /*------------------------------------------------------------------------------*/ #footer-top { height:50px; } /*------------------------------------------------------------------------------*/ #footer-bottom { height:24px; color:#999; text-decoration: none; text-shadow: 1px 1px 0px #000; font-family:'Yellowtail'; line-height:24px; color:#aadb02; } #copyright { float:left; line-height:30px; font-family: 'Play', sans-serif; text-shadow: 1px 1px 0px rgba(255, 255, 255, .75); filter: dropshadow(color=#000000, offx=0, offy=1); color:#212121; } #category-select form { float:right; } /*------------------------------------------------------------------------------*/ input:focus, select:focus { outline: none; } .InputGroup { display: inline-block; padding: 3px 4px; border: 1px solid #FFF; border-radius: 7px; -moz-border-radius: 7px; } .ErrorField { border-color: #D00; color: #D00; background: #FFFFFE; } span.ValidationErrors { display: inline-block; font-size: 12px; color: #D00; padding-left: 10px; font-style: italic; } /* -------------------------------------------------- Reveal Modals -------------------------------------------------- */ .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(0,0,0,.8); z-index: 100; display: none; top: 0; left: 0; } .reveal-modal { visibility: hidden; top: 100px; left: 50%; margin-left: -300px; width: 520px; background: #eee url(../resource/img/modal-gloss.png) no-repeat -200px -80px; position: absolute; z-index: 101; padding: 30px 40px 34px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 0 10px rgba(0,0,0,.4); -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4); -box-shadow: 0 0 10px rgba(0,0,0,.4); } .reveal-modal.small { width: 200px; margin-left: -140px;} .reveal-modal.medium { width: 400px; margin-left: -240px;} .reveal-modal.large { width: 600px; margin-left: -340px;} .reveal-modal.xlarge { width: 800px; margin-left: -440px;} .reveal-modal .close-reveal-modal { font-size: 22px; line-height: .5; position: absolute; top: 8px; right: 11px; color: #aaa; text-shadow: 0 -1px 1px rbga(0,0,0,.6); font-weight: bold; cursor: pointer; } /* ==|== non-semantic helper classes ======================================== Please define your styles before this section. ========================================================================== */ /* For image replacement */ .ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; } .ir br { display: none; } /* Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } /* Hide only visually, but have it available for screenreaders: h5bp.com/v */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* Hide visually and from screenreaders, but maintain layout */ .invisible { visibility: hidden; } /* Contain floats: h5bp.com/q */ .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { zoom: 1; } /* ==|== media queries ====================================================== PLACEHOLDER Media Queries for Responsive Design. These override the primary ('mobile first') styles Modify as content requires. ========================================================================== */ @media only screen and (min-width: 480px) { /* Style adjustments for viewports 480px and over go here */ } @media only screen and (min-width: 768px) { /* Style adjustments for viewports 768px and over go here */ } /* ==|== print styles ======================================================= Print styles. Inlined to avoid required HTTP connection: h5bp.com/r ========================================================================== */ @media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */ a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } /* h5bp.com/t */ tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USDaniel Cheeseman
    1. USDaniel Cheeseman
    plurals
    1. This table or related slice is empty.
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COCould you post a link to a live version, or at least include the relevant HTML and CSS? Also, what version of Firefox are you testing this in?
      singulars
      1. POStrange border on fixed postition elements in firefox 7.0.1
      1. USChris Starnes
    2. COHi Chris, I have included the main html and css, I cannot post a link as the site is local.. I am using firefox 7.0.1, Cheers, Danny.
      singulars
      1. POStrange border on fixed postition elements in firefox 7.0.1
      1. USDaniel Cheeseman
    3. COMan, when I asked for HTML and CSS, you definitely gave me plenty of it! I couldn't get the same problem to display, but it looks like the page's styles didn't get set correctly on my end. The first thing I would try is removing the `box-shadow` (and `-webkit-box-shadow` and `-moz-box-shadow`) properties from the `footer` CSS selector. If that doesn't work, it might help to know if the CSS you posted is everything for the site, or just a portion of it.
      singulars
      1. POStrange border on fixed postition elements in firefox 7.0.1
      1. USChris Starnes
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload