Validation check problem

what to do with this problems?

Line 249,
    Column 23:
Element style not allowed as child of element div in this context. (Suppressing further errors from this subtree.)
<style type="text/css">

Well, without seeing the actual document, just for the message…

<style> tags should go at the <head> of the document... never in the <body> and, of course, never inside a <div> element

You probably just have <style> outside of the head element.

<?php $custom_css = false; ?>
<div class="<?php if($slider['settings']['layout_type'] == 1) { echo 'container'; } else { echo 'fullwidth'; } ?>">
    <div class="fullwidthbanner-container slider-container-<?php echo $slider['id']; ?>">
        <div class="fullwidthbanner slider-<?php echo $slider['id']; ?>">
            <ul>
                <?php foreach($slider['content'] as $sliders) {
                    if($sliders[$language_id]['status'] == 1) {
                        $description = false; 
                        $link = false;
                        $image = $sliders[$language_id]['slider'];
                        
                        if($image == '') { $image = 'data/transparent.png'; }
                        
                        if($sliders[$language_id]['link'] != '') {
                            $link = ' data-link="'.$sliders[$language_id]['link'].'"';
                        }
                        
                        if(isset($sliders[$language_id]['elements'])) {
                            if(is_array($sliders[$language_id]['elements'])) {
                                foreach($sliders[$language_id]['elements'] as $element) {
                                    if($element['status'] == 1) {
                                        $content_element = html_entity_decode($element['text']);
                                        $element_class = $element['element_class'];
                                        $element_class .= ' '.$element['animation_class'];
                                        $custom_css .= $element['style']."\n";
                                        
                                        if($element['element_type'] == 'image') {
                                            $content_element = '';
                                            
                                            if($element['image_url'] != '') {
                                                $target = false;
                                                if($element['image_url_new_tab'] == '1') {
                                                    $target = 'target="_blank"';
                                                }
                                                $content_element .= '<a href="'.$element['image_url'].'" '.$target.'>';
                                            }
                                                                                        
                                            $content_element .= '<img src="image/'.$element['image'].'" alt="wunderbaum til bilen">';
                                            
                                            if($element['image_url'] != '') {
                                                $content_element .= '</a>';
                                            }
                                        }
                                        
                                        $description .= '<div class="caption '.$element_class.'" data-x="'.$element['x'].'" data-y="'.$element['y'].'" data-speed="'.$element['speed'].'" data-start="'.$element['start'].'" data-easing="'.$element['easing'].'" data-endspeed="'.$element['speed'].'" data-endeasing="'.$element['endeasing'].'">'.$content_element.'</div>';
                                    }
                                }
                            }
                        }
                        
                        echo '<li data-transition="'.$sliders[$language_id]['transition_effect'].'" data-slotamount="10" data-masterspeed="300"'.$link.'><img src="image/'.$image.'" alt="bildufte" data-fullwidthcentering="on">'.$description.'</li>';
                    }
                } ?>
            </ul>
        </div>
    </div>
</div>

<style type="text/css">
    
    <?php echo $custom_css; ?>
    
    .slider-container-<?php echo $slider['id']; ?>{ max-height:<?php echo $slider['settings']['slider_height']; ?>px !important; }

</style>

            <!--
            ##############################
             - ACTIVATE THE BANNER HERE -
            ##############################
            -->
            <script type="text/javascript">
            
                var api;
                jQuery(document).ready(function() {
                     api =  jQuery('.slider-<?php echo $slider['id']; ?>').revolution(
                                    {
                                        delay:<?php echo $slider['settings']['slider_speed']*1000; ?>,
                                        startheight:<?php echo $slider['settings']['slider_height']; ?>,
                                        startwidth:<?php echo $slider['settings']['slider_width']; ?>,
                                        onHoverStop:"on",                        // Stop Banner Timet at Hover on Slide on/off
            
                                        thumbWidth:100,                            // Thumb With and Height and Amount (only if navigation Tyope set to thumb !)
                                        thumbHeight:50,
                                        thumbAmount:3,
            
                                        hideThumbs:0,
                                        navigationType:"bullet",                    //bullet, thumb, none, both     (No Shadow in Fullwidth Version !)
                                        navigationArrows:"verticalcentered",        //nexttobullets, verticalcentered, none
                                        navigationStyle:"round",                //round,square,navbar
            
                                        touchenabled:"on",                        // Enable Swipe Function : on/off
            
                                        navOffsetHorizontal:0,
                                        navOffsetVertical:20,
            
                                        stopAtSlide:-1,                            // Stop Timer if Slide "x" has been Reached. If stopAfterLoops set to 0, then it stops already in the first Loop at slide X which defined. -1 means do not stop at any slide. stopAfterLoops has no sinn in this case.
                                        stopAfterLoops:-1,                        // Stop Timer if All slides has been played "x" times. IT will stop at THe slide which is defined via stopAtSlide:x, if set to -1 slide never stop automatic
            
                                        hideCaptionAtLimit:0,                    // It Defines if a caption should be shown under a Screen Resolution ( Basod on The Width of Browser)
                                        hideAllCaptionAtLilmit:0,                // Hide all The Captions if Width of Browser is less then this value
                                        hideSliderAtLimit:0,                    // Hide the whole slider, and stop also functions if Width of Browser is less than this value
            
            
                                        fullWidth:"on",
            
                                        shadow:0                                //0 = no Shadow, 1,2,3 = 3 Different Art of Shadows -  (No Shadow in Fullwidth Version !)
                                    });
                });

            </script>

it’s one file together… i dont know why they split to two

Please format your code. Highlight your code and press the </> button in the editor.

Also, we would prefer the rendered HTML since that’s all the validator sees.

sorry

this should be in between of waht i pasted, and is the problem

style type="text/css"

	.new_element_2_14 {
 width: auto;
 background: none;
 font-size: 100%;
 line-height: 1.3;
 font-family: Open Sans;
}
.vlarge_skin_alt {
 font-size: 80px;
 color: #735741;
 font-weight: 500;
 line-height: 100px;
}

.desc_skin {
 font-size:24px;
 font-weight:300;
 color:#ffbb00;
 line-height:24px;
}
.large_skin_alt {
 font-size:30px;
 color:#735741;
 font-weight:500;
 line-height:43px;
}
	
	.slider-container-1{ max-height:500px !important; }

/style

You still didn’t format like I said. Highlight your code and press the </> button in the editor box.

I need the FULL HTML CODE though. Not some random snippet. That snippet there would validate most likely (it wouldn’t show the error you describe)

FULL code please. Open the source code in your browser and copy past that.

<?php $custom_css = false; ?>
<div class="<?php if($slider['settings']['layout_type'] == 1) { echo 'container'; } else { echo 'fullwidth'; } ?>">
    <div class="fullwidthbanner-container slider-container-<?php echo $slider['id']; ?>">
        <div class="fullwidthbanner slider-<?php echo $slider['id']; ?>">
            <ul>
                <?php foreach($slider['content'] as $sliders) {
                    if($sliders[$language_id]['status'] == 1) {
                        $description = false; 
                        $link = false;
                        $image = $sliders[$language_id]['slider'];
                        
                        if($image == '') { $image = 'data/transparent.png'; }
                        
                        if($sliders[$language_id]['link'] != '') {
                            $link = ' data-link="'.$sliders[$language_id]['link'].'"';
                        }
                        
                        if(isset($sliders[$language_id]['elements'])) {
                            if(is_array($sliders[$language_id]['elements'])) {
                                foreach($sliders[$language_id]['elements'] as $element) {
                                    if($element['status'] == 1) {
                                        $content_element = html_entity_decode($element['text']);
                                        $element_class = $element['element_class'];
                                        $element_class .= ' '.$element['animation_class'];
                                        $custom_css .= $element['style']."\n";
                                        
                                        if($element['element_type'] == 'image') {
                                            $content_element = '';
                                            
                                            if($element['image_url'] != '') {
                                                $target = false;
                                                if($element['image_url_new_tab'] == '1') {
                                                    $target = 'target="_blank"';
                                                }
                                                $content_element .= '<a href="'.$element['image_url'].'" '.$target.'>';
                                            }
                                                                                        
                                            $content_element .= '<img src="image/'.$element['image'].'" alt="wunderbaum til bilen">';
                                            
                                            if($element['image_url'] != '') {
                                                $content_element .= '</a>';
                                            }
                                        }
                                        
                                        $description .= '<div class="caption '.$element_class.'" data-x="'.$element['x'].'" data-y="'.$element['y'].'" data-speed="'.$element['speed'].'" data-start="'.$element['start'].'" data-easing="'.$element['easing'].'" data-endspeed="'.$element['speed'].'" data-endeasing="'.$element['endeasing'].'">'.$content_element.'</div>';
                                    }
                                }
                            }
                        }
                        
                        echo '<li data-transition="'.$sliders[$language_id]['transition_effect'].'" data-slotamount="10" data-masterspeed="300"'.$link.'><img src="image/'.$image.'" alt="bildufte" data-fullwidthcentering="on">'.$description.'</li>';
                    }
                } ?>
            </ul>
        </div>
    </div>
</div>

<style type="text/css">
    
    <?php echo $custom_css; ?>
    
    .slider-container-<?php echo $slider['id']; ?>{ max-height:<?php echo $slider['settings']['slider_height']; ?>px !important; }

</style>

            <!--
            ##############################
             - ACTIVATE THE BANNER HERE -
            ##############################
            -->
            <script type="text/javascript">
            
                var api;
                jQuery(document).ready(function() {
                     api =  jQuery('.slider-<?php echo $slider['id']; ?>').revolution(
                                    {
                                        delay:<?php echo $slider['settings']['slider_speed']*1000; ?>,
                                        startheight:<?php echo $slider['settings']['slider_height']; ?>,
                                        startwidth:<?php echo $slider['settings']['slider_width']; ?>,
                                        onHoverStop:"on",                        // Stop Banner Timet at Hover on Slide on/off
            
                                        thumbWidth:100,                            // Thumb With and Height and Amount (only if navigation Tyope set to thumb !)
                                        thumbHeight:50,
                                        thumbAmount:3,
            
                                        hideThumbs:0,
                                        navigationType:"bullet",                    //bullet, thumb, none, both     (No Shadow in Fullwidth Version !)
                                        navigationArrows:"verticalcentered",        //nexttobullets, verticalcentered, none
                                        navigationStyle:"round",                //round,square,navbar
            
                                        touchenabled:"on",                        // Enable Swipe Function : on/off
            
                                        navOffsetHorizontal:0,
                                        navOffsetVertical:20,
            
                                        stopAtSlide:-1,                            // Stop Timer if Slide "x" has been Reached. If stopAfterLoops set to 0, then it stops already in the first Loop at slide X which defined. -1 means do not stop at any slide. stopAfterLoops has no sinn in this case.
                                        stopAfterLoops:-1,                        // Stop Timer if All slides has been played "x" times. IT will stop at THe slide which is defined via stopAtSlide:x, if set to -1 slide never stop automatic
            
                                        hideCaptionAtLimit:0,                    // It Defines if a caption should be shown under a Screen Resolution ( Basod on The Width of Browser)
                                        hideAllCaptionAtLilmit:0,                // Hide all The Captions if Width of Browser is less then this value
                                        hideSliderAtLimit:0,                    // Hide the whole slider, and stop also functions if Width of Browser is less than this value
            
            
                                        fullWidth:"on",
            
                                        shadow:0                                //0 = no Shadow, 1,2,3 = 3 Different Art of Shadows -  (No Shadow in Fullwidth Version !)
                                    });
                });

            </script>

like this?

Close. That’s the PHP code. I need you to go to this page in your browser. Whatever page has this code for it.

Go right click and view the source. I need THAT code. And hten format exactly as you just did.

I do see you have a <style> there in the mix with different <div>'s but I can show you how to move it.

Ok well this code

<style type="text/css">

    <?php echo $custom_css; ?>

    .slider-container-<?php echo $slider['id']; ?>{ max-height:<?php echo $slider['settings']['slider_height']; ?>px !important; }

</style>

This cannot be in the code snippet you just posted. It has to be in a CSS file or in the <head> section. This code is within <body> and that’s unacceptable to the validator.

this is the .css file, what could be done her eventually? or should i post in the other sections of this forum?

/*************************
    -    CAPTIONS    -
**************************/

.tp-caption.noshadow {
        text-shadow: none;        
    }    


.tp_inner_padding    {    box-sizing:border-box;
                        -webkit-box-sizing:border-box;
                        -moz-box-sizing:border-box;
                        max-height:none !important;    }






/****************************************************************

    -    SET THE ANIMATION EVEN MORE SMOOTHER ON ANDROID   -

******************************************************************/

.tp-simpleresponsive .slotholder *,
.tp-simpleresponsive img            { -webkit-transform: translateZ(0);
                                          -webkit-backface-visibility: hidden;
                                          -webkit-perspective: 1000;
                                    }


/************************************************
      - SOME CAPTION MODIFICATION AT START  -
*************************************************/
.tp-simpleresponsive .caption,
.tp-simpleresponsive .tp-caption {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";    -moz-opacity: 0;    -khtml-opacity: 0;    opacity: 0; position:absolute; visibility: hidden;

}

.tp-simpleresponsive img    {    max-width:none;}

/******************************
    -    IE8 HACKS    -
*******************************/
.noFilterClass {
    filter:none !important;
}

/********************************
    -    FULLSCREEN VIDEO    -
*********************************/
.caption.fullscreenvideo {    left:0px; top:0px; position:absolute;width:100%;height:100%;}
.caption.fullscreenvideo iframe    { width:100% !important; height:100% !important;}

.tp-caption.fullscreenvideo {    left:0px; top:0px; position:absolute;width:100%;height:100%;}
.tp-caption.fullscreenvideo iframe    { width:100% !important; height:100% !important;}

/************************
    -    NAVIGATION    -
*************************/

/** BULLETS **/
.tp-bullets {    
    display: none;
}

/*************************************
    -    TP ARROWS     -
**************************************/

.fullwidthbanner-container .tp-leftarrow {    
    z-index:100;
    cursor:pointer; 
    position:relative;    
    top: 50% !important;
    left: 40px !important; 
    font-size: 100px;
    color: #D5D7CA;
    font-family: fontawesome;
    margin-top:-35px;
    display:none;
    transition:         all 0.6s;
    -o-transition:      all 0.6s;
    -ms-transition:     all 0.6s;
    -moz-transition:    all 0.6s;
    -webkit-transition: all 0.6s;
    
}
    
    .fullwidthbanner-container .tp-leftarrow:before {
        content: "\f104";
    }

.fullwidthbanner-container .tp-rightarrow {    
    z-index:100;
    cursor:pointer; 
    position:relative;    
    font-size: 100px;
    color: #D5D7CA;
    font-family: fontawesome;
    margin-top:-35px;
    top: 50% !important;
    right: 40px !important;
    display:none; 
    transition:         all 0.6s;
    -o-transition:      all 0.6s;
    -ms-transition:     all 0.6s;
    -moz-transition:    all 0.6s;
    -webkit-transition: all 0.6s;
}

    .fullwidthbanner-container .tp-rightarrow:before {
        content: "\f105";
    }

.fullwidthbanner-container:hover .tp-leftarrow, .fullwidthbanner-container:hover .tp-rightarrow { display:block; }
.fullwidthbanner-container .tp-rightarrow:hover { opacity:1;color: #000; }
.fullwidthbanner-container .tp-leftarrow:hover { opacity:1;color: #000; }


/****************************************************************************************************
    -    TP THUMBS     -
*****************************************************************************************************

 - tp-thumbs & tp-mask Width is the width of the basic Thumb Container (500px basic settings)

 - .bullet width & height is the dimension of a simple Thumbnail (basic 100px x 50px)

 *****************************************************************************************************/


.tp-bullets.tp-thumbs                        {    z-index:100; position:absolute; padding:3px;background-color:#fff;
                                                width:500px;height:50px;             /* THE DIMENSIONS OF THE THUMB CONTAINER */
                                                margin-top:-50px;
                                            }

.fullwidthbanner-container .tp-thumbs        {  padding:3px;}

.tp-bullets.tp-thumbs .tp-mask                {    width:500px; height:50px;              /* THE DIMENSIONS OF THE THUMB CONTAINER */
                                                overflow:hidden; position:relative;}


.tp-bullets.tp-thumbs .tp-mask .tp-thumbcontainer    {    width:5000px; position:absolute;}

.tp-bullets.tp-thumbs .bullet                {   width:100px; height:50px;             /* THE DIMENSION OF A SINGLE THUMB */
                                                cursor:pointer; overflow:hidden;background:none;margin:0;float:left;
                                                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
                                                /*filter: alpha(opacity=50);    */                                                
                                                -moz-opacity: 0.5;
                                                -khtml-opacity: 0.5;
                                                opacity: 0.5;
                            
                                                -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out;
                                            }


.tp-bullets.tp-thumbs .bullet:hover,
.tp-bullets.tp-thumbs .bullet.selected        {     -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

                                                -moz-opacity: 1;
                                                -khtml-opacity: 1;
                                                opacity: 1;
                                            }
.tp-thumbs img                                {    width:100%; }


/************************************
        -    TP BANNER TIMER        -
*************************************/
.tp-bannertimer                                {    width:100%; height:10px;position:absolute; z-index:200;}
.tp-bannertimer.tp-bottom                    {    bottom:0px !important;height:5px;}




/***************************************
    -    RESPONSIVE SETTINGS     -
****************************************/


    @media only screen and (min-width: 768px) and (max-width: 959px) {

     }



    @media only screen and (min-width: 480px) and (max-width: 767px) {
            .responsive .tp-bullets.tp-thumbs                {    width:300px !important; height:30px !important;}
            .responsive .tp-bullets.tp-thumbs .tp-mask        {    width:300px !important; height:30px !important;}
            .responsive .tp-bullets.tp-thumbs .bullet        {    width:60px !important;height:30px !important;}

    }

    @media only screen and (min-width: 0px) and (max-width: 479px) {
                .responsive .tp-bullets    {    display:none}
                .responsive .tparrows    {    display:none;}
    }
    
    @media (max-width: 479px) { 
        .responsive .fullwidthbanner-container .button {
            padding: 6px 10px;
            font-size: 10px;
        }
    }




/*********************************************

    -    BASIC SETTINGS FOR THE BANNER    -

***********************************************/

 .tp-simpleresponsive img {
        -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -o-user-select: none;
}



.tp-simpleresponsive a{    text-decoration:none;}

.tp-simpleresponsive ul {
    list-style:none;
    padding:0;
    margin:0;
}

.tp-simpleresponsive >ul >li{
    list-stye:none;
    position:absolute;
    visibility:hidden;
}
/*  CAPTION SLIDELINK   **/
.caption.slidelink a div,
.tp-caption.slidelink a div {    width:10000px; height:10000px; }

.tp-loader     {    
    background:url(../img/loader.gif) no-repeat 10px 10px; 
    background-color:#fff;  
    margin:-22px -22px; 
    top:50%; 
    left:50%; 
    z-index:10000; 
    position:absolute;
    width:44px;
    height:44px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}


.fullwidthbanner-container { 
    width:100% !important;
    position:relative;
    padding:0;
    margin: 30px 0px 0px 0px;
    overflow: hidden !important;
    z-index: 0;
}

    #slider .fullwidth .fullwidthbanner-container {
        margin: 0px;
    }
    
    .fullwidthbanner-container ul {
        padding: 0px;
        margin: 0px;
        list-style: none;
    }

You have some options. You could just post that PHP in the CSS file and just set up your server to parse PHP in CSS files. I assume it’s possible. Or you can just move it to the <head> section like I said.

the <head> section should be in another file, right? I just tested that but the fonts seems to change to the standards

Not normally. Usually it just comes before the <body> section in the same file.

Depends on how yo uhave it set up. If that page you posted was just an include() file then it’s possible.

Hand this over to your developer. I’m afraid of telling you to move code if you don’t know the structure. Was that the full code you posted? For a full page? I doubt it. I don’t see any doctype or <html> tag…this is probably an include file or something.

yes, it was the full code of the one file

What does that page view-source look like in a browser?

I’m curious, because these are teh first 3 lines

<?php $custom_css = false; ?>
<div class="<?php if($slider['settings']['layout_type'] == 1) { echo 'container'; } else { echo 'fullwidth'; } ?>">
    <div class="fullwidthbanner-container slider-container-<?php echo $slider['id']; ?>">

You tell me. Where is the <html>? <head>? <body>? I’ll tell you why - it’s either an include file or your page is SEVERLY screwed up. I doubt it’d screwed up that bad since you’re on a team. So that means it’s an include file. Or some other random 3rd option I might be blanking on.

Tl;dr, that’s not a full page there.