Faire en sorte que le footer prenne toute la largeur de la page

Information importante

En raison d'un grand nombre d'inscriptions de spammers sur notre site, polluant sans relache notre forum, nous suspendons la création de compte via le formulaire de "sign up".

Il est néanmoins toujours possible de devenir adhérent•e en faisant la demande sur cette page, rubrique "Inscription" : https://www.drupal.fr/contact


De plus, le forum est désormais "interdit en écriture". Il n'est plus autorisé d'y écrire un sujet/billet/commentaire.

Pour contacter la communauté, merci de rejoindre le slack "drupalfrance".

Si vous voulez contacter le bureau de l'association, utilisez le formulaire disponible ici, ou envoyez-nous un DM sur twitter.

Submitted by cath on

Bonjour, J'expérimente quelques difficultés concernant le footer d'un site développé avec le thème zen (je ne connais pas la version) par une autre personne avec qui je n'ai pas de contacts.

Le bloc du footer s'affichait en bas de page, entre les sidebars.

J'ai enlevé le footer (je l'ai mis dans des div à part) du reste du contenu dans page.tpl.php afin qu'il puisse déborder au delà du centre du site.

J'ai ensuite voulu modifier le css mais quoique je rentre dans le footer, je ne voyais pas de différence. J'ai donc ajouté le nom généré par drupal pour le bloc du footer dans le css: #block-block-4

Et j'ai entré ce code:

#block-block-4 /* "Block footer */
{
width: 100%;
background-color: #000000;
float:none;
margin-top: 15em;
height: 15em;
clear: both;
position:absolute;
border-bottom: 0px;
    text-align: center;
}

Du coup, mon footer s'est décalé vers le bas et prend maintenant la largeur du site sans prendre toute la largeur de la page, comme le fait le header et comme je voudrais qu'il fasse. Voici le site: http://www.etoile-cinemas.com/ Si quelqu'un a une idée, je m'arrache les cheveux avec ce truc... Merci d'avance. Catherine

Forum : 
Support général
Version de Drupal : 
6.x

Soumis par takeova le 15 Mars, 2010 - 17:24

Votre footer div#block-block-4 est un enfant de div#page qui est de width:942px avec margin:0 auto. Donc ce footer ne pourra pas s'étendre sur toute la largeur de la page, il est nécessaire que votre block footer soit en dehors de div#page.

Soumis par cath le 16 Mars, 2010 - 08:36

Merci pour l'info :-)
Mais...comment faire pour le sortir de div#page?
J'imagine que c'est pas dans le css?
Désolée, mais je débute dans ce type de manip...
Cath

Soumis par cath le 29 Mars, 2010 - 15:57

Merci pour vos réponses. En fait, je me suis aperçue que le footer n'était pas défini comme footer dans l'admin des blocs mais comme "content bottom". Du coup, ça changeait rien de sortir le footer des div page dans le page.tpl.

Le problème que j'ai maintenant est que quand je définis le footer comme block footer via l'admin, j'ai ce que je veux point de vue largeur (toute la page) mais le footer se colle sous le header. D'ailleurs, on voit dans l'admin des blocks que les régions footer et closure sont mal placés. Je me permets d'envoyer de coller le code de mon page.tpl (il y a aussi un pagefront.tpl qui suit la même logique).

Merci d'avance pour votre aide Catherine

<?php
// $Id: page.tpl.php,v 1.14.2.6 2009/02/13 16:28:33 johnalbin Exp $

/**
 * @file page.tpl.php
 *
 * Theme implementation to display a single Drupal page.
 *
 * Available variables:
 *
 * General utility variables:
 * - $base_path: The base URL path of the Drupal installation. At the very
 *   least, this will always default to /.
 * - $css: An array of CSS files for the current page.
 * - $directory: The directory the theme is located in, e.g. themes/garland or
 *   themes/garland/minelli.
 * - $is_front: TRUE if the current page is the front page. Used to toggle the mission statement.
 * - $logged_in: TRUE if the user is registered and signed in.
 * - $is_admin: TRUE if the user has permission to access administration pages.
 *
 * Page metadata:
 * - $language: (object) The language the site is being displayed in.
 *   $language->language contains its textual representation.
 *   $language->dir contains the language direction. It will either be 'ltr' or 'rtl'.
 * - $head_title: A modified version of the page title, for use in the TITLE tag.
 * - $head: Markup for the HEAD section (including meta tags, keyword tags, and
 *   so on).
 * - $styles: Style tags necessary to import all CSS files for the page.
 * - $scripts: Script tags necessary to load the JavaScript files and settings
 *   for the page.
 * - $body_classes: A set of CSS classes for the BODY tag. This contains flags
 *   indicating the current layout (multiple columns, single column), the current
 *   path, whether the user is logged in, and so on.
 * - $body_classes_array: An array of the body classes. This is easier to
 *   manipulate then the string in $body_classes.
 *
 * Site identity:
 * - $front_page: The URL of the front page. Use this instead of $base_path,
 *   when linking to the front page. This includes the language domain or prefix.
 * - $logo: The path to the logo image, as defined in theme configuration.
 * - $site_name: The name of the site, empty when display has been disabled
 *   in theme settings.
 * - $site_slogan: The slogan of the site, empty when display has been disabled
 *   in theme settings.
 * - $mission: The text of the site mission, empty when display has been disabled
 *   in theme settings.
 *
 * Navigation:
 * - $search_box: HTML to display the search box, empty if search has been disabled.
 * - $primary_links (array): An array containing primary navigation links for the
 *   site, if they have been configured.
 * - $secondary_links (array): An array containing secondary navigation links for
 *   the site, if they have been configured.
 *
 * Page content (in order of occurrance in the default page.tpl.php):
 * - $left: The HTML for the left sidebar.
 *
 * - $breadcrumb: The breadcrumb trail for the current page.
 * - $title: The page title, for use in the actual HTML content.
 * - $help: Dynamic help text, mostly for admin pages.
 * - $messages: HTML for status and error messages. Should be displayed prominently.
 * - $tabs: Tabs linking to any sub-pages beneath the current page (e.g., the view
 *   and edit tabs when displaying a node).
 *
 * - $content: The main content of the current Drupal page.
 *
 * - $right: The HTML for the right sidebar.
 *
 * Footer/closing data:
 * - $feed_icons: A string of all feed icons for the current page.
 * - $footer_message: The footer message as defined in the admin settings.
 * - $footer : The footer region.
 * - $closure: Final closing markup from any modules that have altered the page.
 *   This variable should always be output last, after all other dynamic content.
 *
 * @see template_preprocess()
 * @see template_preprocess_page()
 */
 $img = $base_path.$directory."/images/";
?>
<!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="<?php print $language->language; ?>" lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>">

<head>
  <title><?php print $head_title; ?></title>
  <?php print $head; ?>
  <?php print $styles; ?>
  <?php print $scripts; ?>
<script type="text/javascript" src="<?= $base_path.$directory ?>/js/jcarousellite_1.0.1.js"></script>

<script> <!-- test: by Slava -->
$(document).ready(function(){
$('li.headlink').hover(
function() {$('a.activeMenurollover, ul,', this).show(); },
function() {$('a.activeMenurollover, ul,', this).hide(); });

<? if(arg(0) == 'salle-actus') :?>
$('.activeMenu:first').show();
<? elseif(arg(0) == 'films' || strstr(url($_GET['q']),'film')):?>
$('.activeMenu').each(function(index_menu){
if(index_menu == 2){
$(this).show();
}
});
<? elseif(strstr(url($_GET['q']),'location')):?>
$('.activeMenu').each(function(index_menu){
if(index_menu == 4){
$(this).show();
}
});
<? endif ?>
});

</script>
<!-- head for flash -->
<script type="text/javascript" src="/sites/all/themes/zen/embedding/swfobject.js"></script>
<script type="text/javascript">
$root_url="http://etoile-cinemas.fr";
var flashvars = {};
// animation des tags
flashvars.animate = false;
// liens des tags
flashvars.balzac = "<? echo $root_url ?>/salle-actus/balzac";
flashvars.sgdp = "<? echo $root_url ?>/salle-actus/st-germain";
flashvars.pagode = "<? echo $root_url ?>/salle-actus/pagode";
flashvars.lilas = "<? echo $root_url ?>/salle-info/lilas";
var params = {};
params.quality = "high";
params.bgcolor = "#000000";
params.allowfullscreen = "true";
params.allowscriptaccess = "always";
var attributes = {};
attributes.id = "headerswf";
swfobject.embedSWF("/sites/all/themes/zen/header.swf","swf","780","127","9.0.0",null,flashvars,params,attributes);
</script>
<!-- head for flash -->  
</head>
<body class="b1 <?php print $body_classes; ?>">

  <div id="header">
  <div id="header-inner" class="clear-block">
  <a href="/"><img border=0 src="<?= $img ?>header-banner.png" style="margin-top:30px;"></a>
   <div id="swf"  style="float:right">
<img src="/sites/all/themes/zen/noflash.jpg" width="816" height="97" usemap="#Map" style="border:none; margin-top:-100px;" />
            <map name="Map" id="Map">
<area shape="rect" coords="480,4,571,93" href="<? echo $base_url ?>/salle-actus/balzac" alt="balzac" />
                <area shape="rect" coords="232,8,426,92" href="<? echo $base_url ?>/salle-actus/st-germain" alt="saint germain des pres" />
                <area shape="rect" coords="89,7,172,93" href="<? echo $base_url ?>/salle-actus/pagode" alt="pagode" />
                <area shape="rect" coords="638,4,762,93" href="<? echo $base_url ?>/salle-info/lilas" alt="lilas" />

            </map>
</div>
<!-- <div class="clear"></div>-->
</div>  </div> <!-- /#header-inner, /#header -->

  <div id="pageContainer">
  <div id="page"><div id="page-inner">

      <?php if ($search_box || $primary_links || $secondary_links || $navbar): ?>
        <div id="navbar"><div id="navbar-inner" class="clear-block region region-navbar">

          <a name="navigation" id="navigation"></a>

          <?php if ($search_box): ?>
            <div id="search-box">
              <?php print $search_box; ?>
            </div> <!-- /#search-box -->
          <?php endif; ?>

          <?php if ($primary_links): ?>
            <div id="primary">
  <?
  //echo zen_primary_links($primary_links);
            $menu = menu_tree_page_data('primary-links');
             echo zen_primary_links2($menu);
            ?>
            </div> <!-- /#primary -->
          <?php endif; ?>

          <?php /* if ($secondary_links): */ ?>
          <?
            /*
            <div id="secondary">
              <?php print theme('links', $secondary_links); ?>
            </div> <!-- /#secondary -->
            */
          ?>
          <?php /* endif; */ ?>

          <?php print $navbar; ?>

        </div></div> <!-- /#navbar-inner, /#navbar -->
      <?php endif; ?>

    <div id="main"><div id="main-inner" class="clear-block<?php if ($search_box || $primary_links || $secondary_links || $navbar) { print ' with-navbar'; } ?>">

      <div id="content"><div id="content-inner">

        <?php if ($mission): ?>
          <div id="mission"><?php print $mission; ?></div>
        <?php endif; ?>

        <?php if ($content_top): ?>
          <div id="content-top" class="region region-content_top">
            <?php print $content_top; ?>
          </div> <!-- /#content-top -->
        <?php endif; ?>

<? if ($title): ?>
<h3 id="pageTitle" style="display: none;">
<?= $title ?>
</h3>
<? endif ?>

        <?php if ($breadcrumb || $tabs || $help || $messages): ?>
          <div id="content-header">
            <?php print $messages; ?>

            <?php if ($tabs): ?>
<?php $tabs = _tabs($tabs); ?>
              <div class="tabs"><?php print $tabs; ?></div>
            <?php endif; ?>
            <?php print $help; ?>
          </div> <!-- /#content-header -->
        <?php endif; ?>

        <div id="content-area">
          <?php print $content; ?>
        </div>

        <?php if ($feed_icons): ?>
          <div class="feed-icons"><?php print $feed_icons; ?></div>
        <?php endif; ?>

        <?php if ($content_bottom): ?>
          <div id="content-bottom" class="region region-content_bottom">
            <?php print $content_bottom; ?>
          </div> <!-- /#content-bottom -->
        <?php endif; ?>

      </div></div> <!-- /#content-inner, /#content -->

      <?php if ($left): ?>
        <div id="sidebar-left"><div id="sidebar-left-inner" class="region region-left">
          <?php print $left; ?>
        </div></div> <!-- /#sidebar-left-inner, /#sidebar-left -->
      <?php endif; ?>

      <?php if ($right): ?>
        <div id="sidebar-right"><div id="sidebar-right-inner" class="region region-right">
          <?php print $right; ?>
        </div></div> <!-- /#sidebar-right-inner, /#sidebar-right -->
      <?php endif; ?>

    </div></div> <!-- /#main-inner, /#main -->

   </div> <!-- /#page-inner, /#page -->


  </div>
     
     
    
        <?php if ($footer || $footer_message): ?>
      <div id="footer"><div id="footer-inner" class="region region-footer">

        <?php if ($footer_message): ?>
          <div id="footer-message"><?php print $footer_message; ?></div>
        <?php endif; ?>

        <?php print $footer; ?>

      </div></div> <!-- /#footer-inner, /#footer -->
       

<?php endif; ?>
                         
       
        <?php if ($closure_region): ?>
    <div id="closure-blocks" class="region region-closure"><?php print $closure_region; ?></div>
  <?php endif; ?>

  <?php print $closure; ?>
  <?php echo getDebug(); ?>
 
  

</body>
</html>

Une copie d'écran de mon interface admin des blocks: http://www.etoile-cinema.com/sites/default/files/salle/admin-blocks.jpg

Je n'ai toujours pas trouvé la solution à mon problème de footer qui n'est pas surligné en jaune au bon endroit dans l'admin des blocs.

Personne n'aurait une idée sur la raison pour laquelle le footer n'est pas dans la région où il devrait se trouver normalement?

Merci de m'aider car je tourne en rond!

Soumis par cath le 29 Mars, 2010 - 16:41

Merci. J'ai ajouté des propriétés css au footer dans le fichier css qui semble gérer le footer mais à la base, il n'y en avait pas de définies. Si j'enlève les propriétés css, le footer remonte se coller sous le header dans l'admin des blocks. Actuellement, l'admin est comme sur la copie d'écran suivante: http://www.etoile-cinema.com/images/footer.jpg (il est descendu un peu sur la page). Ce que je ne comprends pas, c'est que dans les régions surlignées en jaune de l'admin blocks, on trouve "content bottom".

/* $Id: layout-fixed.css,v 1.5.2.3 2009/02/13 19:20:19 johnalbin Exp $ */

/*
* LAYOUT STYLES
*
* Define CSS classes to create a table-free, 3-column, 2-column, or single
* column layout depending on whether blocks are enabled in the left or right
* columns.
*
* This layout is based on the Zen Columns layout method.
*   http://drupal.org/node/201428
*
* Only CSS that affects the layout (positioning) of major elements should be
* listed here.  Such as:
*   display, position, float, clear, width, height, min-width, min-height
*   margin, border, padding, overflow
*/


/** body **/
body
{
}

#page,
#closure-blocks
{
/*
* If you want to make the page a fixed width and centered in the viewport,
* this is the standards-compliant way to do that. See also the ie.css file
* for the necessary IE5 hack to center a div.
*/
margin-left: auto;
margin-right: auto;
width: 942px;
}

#page-inner
{
}

#navigation-top,
#navigation
{
position: absolute; /* Take the named anchors out of the doc flow    */
left: -10000px;     /* and prevent any anchor styles from appearing. */
}

#skip-to-nav
{
float: right;
margin: 0 !important;
font-size: 0.8em;
}

#skip-to-nav a:link, #skip-to-nav a:visited
{
color: #fff; /* Same as background color of page */
}

#skip-to-nav a:hover
{
color: #000;
text-decoration: none;
}

/* Alternatively, the skip-to-nav link can be completely hidden until a user tabs
to the link. Un-comment the following CSS to use this technique. */
/*
#skip-to-nav a, #skip-to-nav a:hover, #skip-to-nav a:visited
{
position: absolute;
left: 0;
top: -500px;
width: 1px;
height: 1px;
overflow: hidden;
}

#skip-to-nav a:active, #skip-to-nav a:focus
{
position: static;
width: auto;
height: auto;
}
*/

/** header **/
#header
{
}

#header-inner
{
}

#logo-title
{
}

#logo
{
float: left;
}

#site-name
{
}

#site-slogan
{
}

#header-blocks
{
clear: both; /* Clear the logo */
}

/** main (container for everything else) **/
#main
{
position: absolute;
margin-top: 10px;
z-index:-2;
width:942px;
}

#main-inner
{
}

/** content **/
#content,
.no-sidebars #content
{
float: left;
width: 942px;
margin-left: 0;
padding: 0; /* DO NOT CHANGE. Add padding or margin to #content-inner. */
}

.sidebar-left #content
{
width: 760px;
margin-left: 200px; /* The width of #sidebar-left. */
}

.sidebar-right #content
{
width: 712px;
margin-left: 0;
}

.two-sidebars #content
{
width: 560px;
margin-left: 200px; /* The width of #sidebar-left */
margin-right: -760px; /* Negative value of #content's width + left margin. */
}

#content-inner
{
margin: 0;
padding: 0;
}

/** navbar **/
#navbar
{
width: 100%;
margin-left: 0;
padding: 0; /* DO NOT CHANGE. Add padding or margin to #navbar-inner. */
}

#navbar li {
padding: 0;
}

.with-navbar #content,
.with-navbar #sidebar-left,
.with-navbar #sidebar-right
{
}

#navbar-inner
{
}

#search-box
{
width: 200px;
margin-right: -200px; /* Negative value of #search-box's width. */
float: left;
}

#primary
{
}

#secondary
{
margin-left: 200px; /* Width of search-box */
}

#navbar ul /* Primary and secondary links */
{
margin: 0;
padding: 0;
text-align: left;
}

#navbar li /* A simple method to get navbar links to appear in one line. */
{
float: left;
}

/* There are many methods to get navbar links to appear in one line.
* Here's an alternate method: */
/*
#navbar li
{
display: inline;
padding: 0 10px 0 0;
}
*/

/** sidebar-left **/
#sidebar-left
{
float: left;
width: 200px;
margin-left: 0;
margin-right: -200px; /* Negative value of #sidebar-left's width + left margin. */
padding: 0; /* DO NOT CHANGE. Add padding or margin to #sidebar-left-inner. */
}

#sidebar-left-inner
{
margin: 0 20px 0 0;
padding: 0;
}

/** sidebar-right **/
#sidebar-right
{
float: right;
width: 230px;
padding: 0; /* DO NOT CHANGE. Add padding or margin to #sidebar-right-inner. */
}

#sidebar-right-inner
{
margin: 0;
padding: 0;
}

/** footer **/
#footer
{
background-color: #000000;
height:100px;
position: absolute;
float:none;
clear:both;
bottom: 0px;
width: 100%;
margin-top: -3em;

}

#footer P {
margin: 0;
padding: 10px;
}

#footer-inner
{
}
/** closure **/
#closure-blocks /* See also the #page declaration above that this div shares. */
{
}

/** Prevent overflowing content **/
#header,
#content,
#navbar,
#sidebar-left,
#sidebar-right,
#footer,
#closure-blocks
{
overflow: visible;
word-wrap: break-word; /* A very nice CSS3 property */
}

#navbar
{
overflow: hidden; /* May need to be removed if using a dynamic drop-down menu */
}

/* If a div.clear-block doesn't have any content after it and its bottom edge
touches the bottom of the viewport, Firefox and Safari will mistakenly
place several pixels worth of space between the bottom of the div and the
bottom of the viewport. Uncomment this CSS property to fix this.
Note: with some over-large content, this property might cause scrollbars
to appear on the #page div.
*/
/*
#page
{
overflow-y: hidden;
}
*/

#alaffiche-header {
background: url(images/header-alaffiche.png);
width: 692px;
height: 29px;
padding-right: 10px;
}

#alaffiche-footer {
/*background: url(images/footer-alaffiche.gif) no-repeat top;
width: 702px;
height: 5px;
margin-top: -3px;
z-index: 999999999;*/
height: 6px;
width: 702px;
background: url(images/footer-alaffiche.gif) no-repeat top;
}

.view-Event-block_1,
.film-avenir {
margin-top: 10px;
_margin-top: 2px;
}

#event-header {
background: url(images/header-evenements.png);
width: 692px;
height: 29px;
padding-right: 10px;
}

#event-body {
background-color: #dedede;
width: 682px;
padding: 10px;
}

.film-avenir .list {
background-color: #dedede;
width: 682px;
padding: 10px;
}

#event-footer {
background: url(images/footer-evenements.png) no-repeat top;
width: 702px;
height: 7px;
}

.salle-actus #event-header {
background: url(images/header2-evenements.png) no-repeat bottom;
width: 672px;
height: 23px;
}

.salle-actus #event-body {
background-color: #b7b7b7;
width: 662px;
padding: 10px;
}

.salle-actus #event-footer,
.salle-actus #avenir-footer,
.salle-actus #alaffiche-footer,
.salle-actus .filmList .footer {
background: url(images/footer2-evenements.png) no-repeat top;
width: 682px;
height: 6px;
}

#avenir-header {
background: url(images/header-avenir.png);
width: 692px;
height: 29px;
padding-right: 10px;
}

#avenir-body {
background-color: #dedede;
width: 682px;
height: 160px;
padding: 10px;
}

#avenir-footer {
background: url(images/footer-evenements.png) no-repeat top;
width: 702px;
height: 7px;
}

#avenir-body .cPrev-avenir,
#avenir-body .cNext-avenir {
float: left;
background: url(images/bt-prev.png);
width: 34px;
height: 57px;
margin-top: 20px;
}

#avenir-body .cNext-avenir {
background: url(images/bt-next.png);
}

#avenir-body .carousel-container {
float: left;
padding-left: 25px;
padding-right: 15px;
}

.salle-actus #avenir-body .cPrev-avenir,
.salle-actus #avenir-body .cNext-avenir,
.salle-actus #alaffiche-body .cPrev-alaffiche,
.salle-actus #alaffiche-body .cNext-alaffiche
{
float: left;
background: url(images/bt2-prev.png);
width: 34px;
height: 57px;
margin-top: 20px;
}

.salle-actus #avenir-body .cNext-avenir,
.salle-actus #alaffiche-body .cNext-alaffiche
{
background: url(images/bt2-next.png);
}

.salle-actus #avenir-body .carousel-container,
.salle-actus #alaffiche-body .carousel-container {
float: left;
padding-left: 15px;
padding-right: 5px;
}

.salle-actus #avenir-header,
.salle-actus .filmList .header {
background: url(images/header2-avenir.png) no-repeat bottom;
width: 672px;
height: 23px;
}

.salle-actus #alaffiche-header {
background: url(images/header2-alaffiche.png) no-repeat bottom;
width: 672px;
height: 23px;
}

.salle-actus #avenir-body,
.salle-actus .film-alaffiche .list,
.salle-actus .film-avenir .list
{
background-color: #b7b7b7;
width: 662px;
padding: 10px;
height: 160px;
height: 190px;
}

.salle-actus .imagefield-field_salle_logo {
display: none;
}

#event-list {
font-face: Arial;
font-size: 11px;
list-style: url(images/event-arrow.gif) disc;
}

#event-list li a, #event-list li a.dateurl {
text-decoration: none;
color: #000000;
font-weight: bold;
}

#event-list li a:hover, #event-list li a.dateurl:hover {
text-decoration: underline;
color: #000000;
font-weight: bold;
}

.node .salle-titre-logo {
float: left;
padding-left: 5px;
}

.node .menu {
float: right;
}

.node .menu a {
font-size: 11px;
color: #b7b7b7;
text-decoration: none;
}

.node .menu a.selected {
font-size: 11px;
color: #ffffff;
text-decoration: none;
}

.event-cat {
padding-bottom: 15px;
}

.event-cat li {
float: left;
list-style-type: none;
font-size: 12px;
text-transform: uppercase;
padding-right: 50px;
}

.clear {
clear: both;
}

.event-cat-header {
background: url(images/header2-empty.png);
width: 647px;
height: 20px;
font-size: 13px;
text-transform: uppercase;
color: #FFFFFF;
padding-left: 15px;
padding-top: 3px;
}

.event-cat-body {
background: #c3c3c3 url(images/footer2-empty.png) no-repeat bottom;
width: 632px;
margin-bottom: 15px;
padding: 15px;
}

/*
  MENU
*/


/* Child lists and links */
#primary li.headlink ul {
display: none;
margin-top: 0px;
}
#primary li.headlink:hover ul {
display: block;
color: #350201;
}
#primary .links{
}
ul.menu li {
border: 1px solid red;
}

ul.menu li a {
padding-left: 12px; /*27*/
font-size: 11px;
background: none;
line-height: 26px;
width: 160px; /*145*/
height: auto;
color: #CBBE8D;
background: url(images/icon/10.png) no-repeat 0 0;
white-space: nowrap;
overflow: hidden;
}
ul.menu li a:hover {
color: #66cdcc;
font-weight: bold;
background-position: 0 100%;
}

ul.menu { border: 1px dashed #0F0 }

#navbar {
overflow: visible !important;
}

#primary LI.headlink {
/*FLOAT: left; */
margin-right: -1px;
position: relative;
display: block;
border-right: 1px solid #676767;
}

#primary li.headlink ul.popupSubmenu {
display: none;
position: absolute;
top: 24px;
left: 0;
z-index: 999999;
}

#primary li.headlink ul.popupSubmenu li {
display: block;
float: none;
padding: 2px 15px;
background: #000;
border-top: 1px solid #666666;
z-index: 999999;
cursor:pointer;
*padding: 3px 15px;
}
#primary li.headlink ul.popupSubmenu li.last{
*padding: 3px 15px 6px 15px;
}

#primary li.headlink ul.popupSubmenu li a {
color: #fff;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
line-height: 18px;
cursor:pointer
}

#primary li.headlink .activeMenu,
#primary li.headlink .activeMenurollover {
display: none;
position: absolute;
left: 0;
top: 0;
}


/*
#primary LI.headlink UL {
MARGIN-TOP: 0px; DISPLAY: none
}
#primary LI.headlink:hover UL {
  display: block;
  color: #350201;
}*/
/*
UL.menu {
border: #0f0 1px dashed;
z-index: 20;*/
/* NON-IE: position: absolute; */
/*
}
UL.menu LI {
border: #0f0 1px solid;
}
UL.menu LI A {
PADDING-LEFT: 12px; FONT-SIZE: 11px; BACKGROUND: url(images/icon/10.png) no-repeat 0px 0px; OVERFLOW: hidden; WIDTH: 160px; COLOR: #cbbe8d; LINE-HEIGHT: 26px; WHITE-SPACE: nowrap; HEIGHT: auto
}
UL.menu LI A:hover {
BACKGROUND-POSITION: 0px 100%; FONT-WEIGHT: bold; COLOR: #66cdcc
}
*/

.ul_container {
margin-top: 1px;
}

.salle-actus .filmList .header {
margin-top: 10px;
padding-right: 10px;
}

.event-elt {
padding-top: 20px;
padding-bottom: 20px;
border-bottom: 1px #d5d5d5 solid;
}

.view-Event-page_1 .first,
.view-Event-page_2 .first {
padding-top: 0;
}

.event-photo {
float: left;
width: 100px;
}

.event-content {
float: right;
width: 530px;
}

.event-cat {
margin-top: 0px;
}

.event-cat .disable a {
color: #000000;
font-weight: bold;
}

.event-cat .active a {
color: #000000;
font-weight: bold;
}

.event-content a {
color: #000000;
text-decoration: underline;
}

.event-cat-header .floatRight {
margin-top: -15px;
margin-right: 10px;
color: #bdbdbe;
font-size: 10px;
text-transform: none;
}

.view-header .floatRight {
margin-top: -20px;
margin-right: 20px;
color: #bdbdbe;
font-size: 10px;
text-transform: none;
}

.event-scroll {
height: 583px;
overflow-y: auto;
overflow-x: hidden;
}

.node-inner a {
color: #000;
}

#event-list li {
margin-bottom: 5px;
}


.view-content .event-cat li a{
white-space:nowrap
}

#slide-wrapper #slide-outer .slide .fpss-introtext{ height:68px}
#block-block-2 object{ _margin-top:-15px;}
.block-cont-avant-premiere{
margin-left: 90px;
width:112px;
}
.node-type-film #page-inner .view-Event-Film .filmEvent .description{
_width:204px;
}