XF 1.3 (Solved) EXTRA.CSS not working after edit public.css

[jmmp]

Hi, (sorry, i'm not speak english)

Today i've edited the template public.css and then EXTRA.CSS stopped working.

I've edited this line in public.css:

.messageText img,
.messageText iframe,
.messageText object,
.messageText embed
{
max-width: 80%;
}

I reverted 80% to 100% and EXTRA.CSS not works.

I can not find the solution and I am very concerned.

 

[Paul B]

If none of the CSS in EXTRA.css works, then check for errors in the templates.

Typically it is due to malformed CSS.

 

[jmmp]

None of the CSS in EXTRA.css works.

How can i check errors in the templates? Any tool?

 

[Paul B]

Try Notepad++.

 

[jmmp]

I can not fix anything with Notepad++...

 

[jmmp]

I'm going to paste my public.css template.

Is there something wrong about code?

<xen:include template="header.css" />

<xen:include template="footer.css" />

<xen:include template="breadcrumb.css" />

<xen:include template="navigation.css" />

<xen:include template="search_bar.css" />

/** move the header to the top again **/

#headerMover
{
    position: relative;
    zoom: 1;
}

    #headerMover #headerProxy
    {
        @property "header.background";
        background-image: url('http://www.xxxxxxxxxxxxxxxxxx.gif');
        @property "/header.background";
        height: {xen:calc '@headerLogoHeight + @headerTabHeight * 2 + 2'}px; /* +2 borders */
    }

    #headerMover #header
    {
        width: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
    }


/** Generic page containers **/

.pageWidth
{
    @property "pageWidth";
    padding-right: 5px;
    padding-left: 5px;
    margin: 0 1%;
    _width: 976px;
    _margin: 0 auto;
    box-sizing: border-box;
    @property "/pageWidth";
}

.NoResponsive body
{
    <xen:if is="@nonResponsiveMinWidth">min-width: @nonResponsiveMinWidth;</xen:if>
}

#content .pageContent
{
    @property "content";
    background-color: rgb(236, 242, 237);
    padding: 10px 20px;
    @property "/content";
}

{xen:helper clearfix, '#content .pageContent'}

<xen:include template="sidebar.css" />

/** Text used in message bodies **/

.messageText
{
    @property "messageText";
    font-size: 10pt;
    font-family: verdana;
    line-height: 1.4;
    @property "/messageText";
}

    .messageText img,
    .messageText iframe,
    .messageText object,
    .messageText embed
    {
        max-width: 80%;
    }

/** Link groups and pagenav container **/

.pageNavLinkGroup
{
    display: table;
    *zoom: 1;
    table-layout: fixed;
    box-sizing: border-box;

    @property "pageNavLinkGroup";
    font-size: 13px;
    margin: 10px 0;
    line-height: 16px;
    @property "/pageNavLinkGroup";
}

opera:-o-prefocus, .pageNavLinkGroup
{
    display: block;
    overflow: hidden;
}

    .pageNavLinkGroup:after
    {
        content: ". .";
        display: block;
        word-spacing: 99in;
        overflow: hidden;
        height: 0;
        font-size: 0.13em;
        line-height: 0;
    }

    .pageNavLinkGroup .linkGroup
    {
        float: right;
    }

.linkGroup
{
}

    .linkGroup a
    {
        @property "linkGroupLink";
        padding: 3px 0;
        @property "/linkGroupLink";
    }

        .linkGroup a.inline
        {
            padding: 0;
        }

    .linkGroup a,
    .linkGroup .Popup,
    .linkGroup .element
    {
        margin-left: @linkGroupLinkSpacing;
        display: block;
        float: left;
        <xen:if is="{$pageIsRtl}">*display: inline; *float: none; *zoom: 1;</xen:if>
    }

        .linkGroup .Popup a
        {
            margin-left: -2px;
            margin-right: -5px;
            *margin-left: @linkGroupLinkSpacing;
            padding: @linkGroupLink.padding-top 5px;
        }

    .linkGroup .element
    {
        padding: 3px 0;
    }

/** Call to action buttons **/

a.callToAction
{
    @property "callToAction";
    background: @primaryLighter url('@imagePath/xenforo/gradients/form-button-white-25px.png') repeat-x center top;
    padding: 2px;
    border: 1px solid @primaryLighter;
    border-radius: 6px;
    display: inline-block;
    line-height: 20px;
    box-shadow: 1px 1px 5px rgba(0,0,0, 0.15);
    outline: 0 none;
    vertical-align: top;
    height: 20px;
    @property "/callToAction";

}

    a.callToAction span
    {
        @property "callToActionSpan";
        background: rgb(176, 228, 165) url('@imagePath/xenforo/gradients/form-button-white-25px.png') repeat-x center -8px;
        padding: 4px;
        border: 1px solid rgb(176, 228, 165);
        border-radius: 6px;
        display: inline-block;
        line-height: 10px;
        box-shadow: 1px 1px 5px rgba(0,0,0, 0.15);
        outline: 0 none;
        height: 10px;
        @property "/callToActionSpan";
    }

    a.callToAction:hover
    {
        text-decoration: none;
    }

        a.callToAction:hover span
        {
            @property "callToActionHover";
            color: rgb(0, 0, 0);
            background-color: rgb(255, 255, 200);
            border-top-color: rgb(255,;
            border-right-color: 255,;
            border-bottom-color: rgb(190, 190, 170);
            border-left-color: 255,;
            @property "/callToActionHover";
        }
    
        a.callToAction:active
        {
            /*position: relative;
            top: 2px;*/
        }
    
        a.callToAction:active span
        {
            @property "callToActionActive";
            background-color: @primaryMedium;
            @property "/callToActionActive";
        }

/*********/

.avatarHeap
{
    overflow: hidden; zoom: 1;
}

    .avatarHeap ol
    {
        margin-right: -4px;
        margin-top: -4px;
    }

        .avatarHeap li
        {
            float: left;
            margin-right: 4px;
            margin-top: 4px;
        }
    
/*********/

.fbWidgetBlock .fb_iframe_widget,
.fbWidgetBlock .fb_iframe_widget > span,
.fbWidgetBlock .fb_iframe_widget iframe
{
    width: 100% !important;
}

<xen:include template="username_styles.css" />

<xen:include template="thread_prefixes.css" />

<xen:include template="user_banners.css" />

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveWideWidth)
{
    .Responsive .pageWidth
    {
        @property "pageWidthResponsiveWide";

        @property "/pageWidthResponsiveWide";
    }

    .Responsive #content .pageContent
    {
        padding-left: {xen:calc '@content.padding-left / 2'}px;
        padding-right: {xen:calc '@content.padding-right / 2'}px;
    }
}

@media (max-width:@maxResponsiveMediumWidth)
{
    .Responsive .pageWidth
    {
        @property "pageWidthResponsiveMedium";
        padding-right: 0;
        padding-left: 0;
        margin-right: 0;
        margin-left: 0;
        @property "/pageWidthResponsiveMedium";
    }

    .Responsive .forum_view #pageDescription,
    .Responsive .thread_view #pageDescription
    {
        display: none;
    }
}

@media (max-width:@maxResponsiveNarrowWidth)
{
    .Responsive .pageWidth
    {
        @property "pageWidthResponsiveNarrow";

        @property "/pageWidthResponsiveNarrow";
    }

    .Responsive .pageNavLinkGroup .PageNav,
    .Responsive .pageNavLinkGroup .linkGroup
    {
        clear: right;
    }
}
</xen:if>

<xen:include template="EXTRA.css" />

 

[jmmp]

Any idea?

 

[eberkund]

Change this part

/* message_simple.css */

.messageSimple .messageContent
{
min-height: 35px;
}
font-family: verdana !important;
font-size: 12px !important;
}

to this:

/* message_simple.css */

.messageSimple .messageContent
{
min-height: 35px;
font-family: verdana !important;
font-size: 12px !important;
}

 

[jmmp]

Not works...

Thank you, eberkund.

 

[jmmp]

Solved!

I've found the code error in public.css.

Search:

a.callToAction:hover span
{
@property "callToActionHover";
color: rgb(0, 0, 0);
background-color: rgb(255, 255, 200);
border-top-color: rgb(255,;
border-right-color: 255,;
border-bottom-color: rgb(190, 190, 170);
border-left-color: 255,;
@property "/callToActionHover";
}

( )

Replace to:

a.callToAction:hover span
{
@property "callToActionHover";
color: rgb(0, 0, 0);
background-color: rgb(255, 255, 200);
@property "/callToActionHover";
}

Now EXTRA.css works fine.