• Hello.

    I have previously asked this question before and no one seems to answer. I am working on a site that changes the customizr layout a bit and removed the functionality on the featured pages. however the third image changes it size compared to the other two which looks odd.
    This is what it says in the inspect element and I know all I have to do is change the height to match the other two but I cannot for the life of me work out where that piece of code is or how to change it in the css. The site is in test mode atm

    element.style {
    display: inline;
    width: auto;
    height: 167px;
    top: 1px;
    left: 2.5px;

    https://omgkatrina.com/work/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hi,
    To understand why this happens, we need to know all the changes that have been made, additional code added and the code removed.

    Thread Starter omgkatrina

    (@omgkatrina)

    This is the only code they have added to that section of the site. No code was removed. Thanks

    /* Featured Puzzle Pieces */
    #featured-pages.row {
    margin-left: 0;
    margin-right: 0;}

    #featured-pages h2 { font-weight:normal;}

    #featured-pages .thumb-wrapper {
    height: auto !important;}

    #featured-pages .thumb-wrapper img {
    max-width: 100%;
    max-height: 70%;
    }

    Hi,
    I tried adding this bit of code to my test set up. It is not affecting featured pages and their images display in any way.

    How did the right sidebar go up beside the featured pages? That is not the default Customizr theme behaviour. That might have a clue.

    Thread Starter omgkatrina

    (@omgkatrina)

    This is the full css edits to the site that I know of.

    Thank you for helping me.

    body {
    color: #808080;
    background-color: white;
    font-family: Verdana,”Helvetica Neue”,Helvetica,Arial,sans-serif;}

    /* HEADER AREA */
    .tc-header { border-bottom: none;}

    .tc-rectangular-thumb > img {
    top: auto!important;}

    /* MENU NAV */
    .navbar-wrapper.span9 {
    margin-left: 0;}

    .navbar .navbar-inner {
    -webkit-box-shadow: none;
    box-shadow: none;
    background: none;}

    .navbar .nav>li>a {
    color: #666;
    font-weight: bold;
    padding: 5px 18px;
    font-size: 1.1em;}

    .navbar .nav>li>a:first-letter {
    font-size: 1.1em;}

    /* CONTENT AREA */

    #content.span9.article-container{
    margin-left: 0;}

    #main-wrapper {
    margin-top: 30px;}

    /* HOME PAGE */
    /* Slider */
    div#customizr-slider {
    width: 100%;}

    img.slide.h-center {
    left: 0!important;
    max-width: none!important;
    width: 100%!important;
    height: auto!important;}

    .carousel .item {
    min-height: 0!important;}

    .carousel-image { position: relative;}

    /* Featured Puzzle Pieces */
    #featured-pages.row {
    margin-left: 0;
    margin-right: 0;}

    #featured-pages h2 { font-weight:normal;}

    #featured-pages .thumb-wrapper {
    height: auto !important;}

    #featured-pages .thumb-wrapper img {
    max-width: 100%;
    max-height: 70%;
    }

    /**
    * WIDGETS
    */

    /* WIDGET: Social icons */
    aside.social-block.widget_social a {
    font-size: 2.2em;
    margin-top:10px;}

    aside.social-block.widget_social a:first-of-type {
    margin-left: 10px;
    }

    /* WIDGET: Mailing list Sign up */
    #mc_embed_signup h2 {
    font-size: 1.3em!important;}

    /**
    * STOP THE IMAGES FROM ANIMATING ON HOVER
    */

    .round-div {
    border-color: transparent;
    }

    hi,
    This does not create any issue in image size on my test system.
    Any plugin conflicts? Try disabling plugins.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Element.Style confusion’ is closed to new replies.