css style not applied, bug in less?

V

Vasily Petrov2017-02-01 19:05:06

css

Vasily Petrov, 2017-02-01 19:05:06

I'm learning wordpress, most likely the error is not in it, and there was such a problem: styles are not applied to .social_section. (less is converted to css after saving)
header.php:

<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" <?php language_attributes(); ?>> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" <?php language_attributes(); ?>> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" <?php language_attributes(); ?>> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" <?php language_attributes(); ?>> <!--<![endif]-->
<head>
  <meta charset="<?php bloginfo( 'charset' ); ?>" />
  <title><?php wp_title('|', true, 'right'); bloginfo('name'); ?></title>
  <?php wp_head(); ?>
</head>
<body <?php body_class(); ?> >

  <header class="top_header">
    <div class="wrapper cf">
      <div class="header_third search_section menu_buttom">
        search
      </div>
      <div class="header_third logo_section">
        <a href="<?php echo home_url("/"); ?>" class="logo_link"><img src="<?php echo ale_get_option('sitelogo'); ?>"></a>
      </div>
      <div class="header_third social_section">
        social
      </div>
    </div>
  </header>
  <section class="home_slider">
    
  </section>

main.less:

@import 'elements.less';

@color_grey: #d4dad9;

/* Your Custom code here */

.wrapper {
  width: 96%;
  max-width: 960px;
  margin: 0 auto;
}


/*
Header Styles
*/

.top_header {
  height: 105px;
  background: #fff;

  &::after {
    content: "";
    display: block;
    width: 100%;
    height: 5px;
    background: url(img/bottom.png) repeat-x center center;
  }

  .header_third {
    width: 33.3%;
    float: left;

    &.logo_section {
      text-align: center;
      line-height: 105px;
      .transition(all 300ms ease-in-out);

      &:hover {
        .opacity(0.6);
        .transition(all 300ms ease-in-out);
      }
    }

    &.social_section {
      text-align: right;
      font-size: 18px;
      color: @color_grey;
      line-height: 105px;
    }
  }
}

UPD: in developer mode, there are no styles for .social_section in the css code, when they are available in the main.css itself... Clearing the cache did not help.
UPD: cache has nothing to do with it. Changes in main.less are saved and translated into main.css, but not further into general.css.

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

V

Vasily Petrov, 2017-02-01
@mbpig

Solved by manually saving all style files -________-