Regarding the flash message moving to the side, I believe that the 
positioning of the flash div is normally done relative to the auth_navbar 
div. (i.e., if I set left:0 for .flash in base.css the flash div is aligned 
with the auth_navbar's left-hand margin. So if you have removed auth_navbar 
(or moved it on the page) that will move the flash div. You'll just have to 
change the .flash  css class to compensate.

As for the colour not changing in the .error div, could this be because 
you're using the name "red" instead of a hex code? or is it a specificity 
issue, so that another more specific style rule is overriding your theme 
change? If you change the basic page layout that can mess with style 
inheritance until you adjust the style rules. I would inspect the error div 
using Firebug or Chrome dev tools. It will tell you what style rules are 
being recognized and which ones are being overridden.

Ian


On Monday, March 12, 2012 3:11:58 PM UTC-4, frasse wrote:
>
> Yes the example app that comes with web2py show correctly on 
> Firefox 10 + Windows. 
> I greed that I am missing some classes from base.css. but I can not 
> found what . 
>
> Here is what I did. 
>
> I copy .flash .error to my css file (the_look.css). 
> It is the copy code: 
> --------------------------------- 
> div.flash { 
>     font-weight: bold; 
>     display: none; 
>     position: fixed; 
>     padding: 10px; 
>     top: 40px; 
>     right: 10px; 
>     min-width: 280px; 
>     opacity: 0.85; 
>     margin: 0px 0px 10px 10px; 
>     color: #fff; 
>     vertical-align: middle; 
>     cursor: pointer; 
>     background: #000; 
>     border: 2px solid #fff; 
>     -moz-border-radius: 5px; 
>     -webkit-border-radius: 5px; 
>     z-index: 2; 
> } 
> div.error { 
>     background-color: red; 
>     color: white; 
>     padding: 3px; 
> } 
> ----------------------------------------------------------- 
>
>
> I have some change in my layout.html here is the change 
>
> ---------------------------- 
> <!DOCTYPE html> 
> <html lang="{{=T.accepted_language or 'en'}}" class="no-js"> 
> <head> 
>    <meta charset="utf-8" /> 
>     <!-- www.phpied.com/conditional-comments-block-downloads/ --> 
>     <!--[if IE]><![endif]--> 
>     <!-- Always force latest IE rendering engine 
>          (even in intranet) & Chrome Frame 
>          Remove this if you use the .htaccess --> 
>     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
>     <title> </title> 
>      <!-- Speaking of Google, don't forget to set your site up: 
>          http://google.com/webmasters --> 
> <meta name="google-site-verification" content="" /> 
>
>   <!--  Mobile Viewport Fix 
>           j.mp/mobileviewport & davidbcalhoun.com/2010/viewport-metatag 
>           device-width: Occupy full width of the screen in its current 
> orientation 
>           initial-scale = 1.0 retains dimensions instead of zooming out if 
> page height > device height 
>           maximum-scale = 1.0 retains dimensions instead of zooming in if 
> page width < device width 
>       --> 
>     <meta name="viewport" content="width=device-width; initial- 
> scale=1.0; maximum-scale=1.0"> 
>
>
>
>
>     <!-- Place favicon.ico and apple-touch-icon.png in the root of 
> your domain and delete these references --> 
>     <link rel="shortcut icon" href="{{=URL('static/ 
> images','favicon.png')}}" type="image/x-icon"> 
>     <link rel="apple-touch-icon" href="{{=URL('static/ 
> images','favicon.png')}}"> 
>     <!-- For the less-enabled mobile browsers like Opera Mini --> 
>     <link rel="stylesheet" media="handheld" href="{{=URL('static','css/ 
> handheld.css')}}"> 
>     <!-- All JavaScript at the bottom, except for Modernizr which 
> enables HTML5 elements & feature detects --> 
>     <script src="{{=URL('static','js/modernizr-1.7.min.js')}}"></ 
> script> 
>     {{#------  require CSS and JS files for this page (read info in 
> base.css) ------}} 
>     {{response.files.append(URL('static','css/the_look.css'))}} 
>     {{# response.files.append(URL('static','css/base.css'))}} 
>     {{response.files.append(URL('static','css/superfish.css'))}} 
>     {{response.files.append(URL('static','js/superfish.js'))}} 
>
>     {{#------ include web2py specific js code (jquery, calendar, form 
> stuff) ------}} 
>     {{include 'web2py_ajax.html'}} 
>     {{ 
>     #using sidebars need to know what sidebar you want to use 
>     #prior of using it, because of static width size of content, you 
> can use 
>     #left_sidebar, right_sidebar, both or none (False left and 
> right) 
>     left_sidebar_enabled = globals().get('left_sidebar_enabled',False) 
>     right_sidebar_enabled = 
> globals().get('right_sidebar_enabled',False) 
>     if left_sidebar_enabled and right_sidebar_enabled: 
> width_content='63%' 
>     elif left_sidebar_enabled != right_sidebar_enabled: 
> width_content='740px' 
>     else: width_content='100%' 
>     if left_sidebar_enabled: left_sidebar_style = 'style="display: 
> block;"' 
>     else: left_sidebar_style = 'style="display: none;"' 
>     if right_sidebar_enabled: right_sidebar_style = 'style="display: 
> block;"' 
>     else: right_sidebar_style = 'style="display: none;"' 
>     style_content = 'style="width: %s"' % width_content 
>     }} 
>
>
> <script src="../static/js/jquery.js" type="text/javascript"></script> 
> --> 
> <!-- Placera denna tagg i <head> eller precis före din </body>-tagg -- 
> > 
>
>
> <script type="text/javascript"> 
> var sek= {{=session.sec}}; 
> var minut={{=session.min}}; 
> var timme={{=session.hour}}; 
> var dag={{=session.day}}; 
>
> </script> 
> <script type="text/javascript" src="../static/js/timern.js"></script> 
>
>
> </head> 
>   <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer- 
> neither/<http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/>-->
>  
>   <!--[if lt IE 7 ]> <body class="ie6"> <![endif]--> 
>   <!--[if IE 7 ]>    <body class="ie7"> <![endif]--> 
>   <!--[if IE 8 ]>    <body class="ie8"> <![endif]--> 
>   <!--[if IE 9 ]>    <body class="ie9"> <![endif]--> 
>   <!--[if (gt IE 9)|!(IE)]><!--> <body onload="nedrakning()"> <!--<! 
> [endif]--> 
>
> <div class="flash">{{=response.flash or ''}}</div> 
>
> <div id="container"> 
>
>
> {{include 'huvud.html'}} 
>
>
> {{include 'meny.html'}} 
>
>
> <div id="mellan"> 
>
> {{include}} 
>
> </div> 
>
> </div> 
>
> </body> 
> </html> 
> ------------------------------------------------------ 
>
>
> /F 
>
>
> On 12 mar, 19:43, monotasker <scotti...@gmail.com> wrote: 
> > Can you post the parts of your css code that aren't working? 
> > 
> > Ian 
> > 
> > 
> > 
> > 
> > 
> > 
> > 
> > On Sunday, March 11, 2012 7:39:42 AM UTC-4, frasse wrote: 
> > 
> > > Hi 
> > 
> > > I like to use my custom css and add it to my application base.css mess 
> > > my application. I have remove base.css and move  classes .flash 
> > > and .error to my custom css file. when I do that it is not working in 
> > > FireFox 10 in windows but it works in all other browser and OS (mac 
> > > Ubuntu , win). 
> > 
> > > Can you please help me with that ? 
> > 
> > > /F

Reply via email to