Another div after the bottom issue

Hi there,

I’m trying to create two sidebar areas, which are meant to be used for ads.

The code with which i added them is:

functions.php:

register_sidebar(array(
		'name'=> 'Ads Sidebar Background Left',
		'id' => 'ads-sidebar-back-left',
		'before_widget' => '<div class="ads-sidebar-back-left-css">',
		'after_widget' => '</div>',
		'before_title' => '<h3>',
		'after_title' => '</h3>',
));

register_sidebar(array(
		'name' => 'Ads Sidebar Background Right',
		'id' => 'ads-sidebar-back-right',
		'before_widget' => '<div class="ads-sidebar-back-right-css">',
		'after_widget' => '</div>',
		'before_title' => '<h3>',
		'after_title' => '</h3>',
));

header.php

<div id="ads-sidebar-back-left" class="ads-sidebar-back-left-css" role="complementary">
		<?php dynamic_sidebar( 'Ads Sidebar Background Left' ); ?>
	</div>

<div id="ads-sidebar-back-right" class="ads-sidebar-back-right-css" role="complementary">
		<?php dynamic_sidebar( 'Ads Sidebar Background Right' ); ?>
	</div>

style.css

div.ads-sidebar-back-left-css {

    height:100%;
    position:absolulte;
top: 10%;
    overflow:hidden;
z-index:1000;
width: 30%;

}

.ads-sidebar-back-left-css img{

    height: 100vh;
}

div.ads-sidebar-back-right-css {

    height:100%;
    position:absolulte;
float: right;
right:5px;
    overflow:hidden;
z-index:1000;
width: 30%;
}

.ads-sidebar-back-right-css img{

    height: 100vh;
}

After that i’m adding ad widgets into them, with the corresponding size and ad script.

The most interesting part is that my left area is showing fine, but the right one is bellow the browser screen.

When i tried to follow the divs I saw that the right one have some divs not generated or the output from tormus div tool is:

<div class="background-cover">
      |<div id="ads-sidebar-back-left" class="ads-sidebar-back-left-css" role="complementary">
      |       |<div id="ads300_600-widget-4" class="ads300-600">
      |       |       |<div class="ad-cell">
      |       |       |</div>
      |       |</div>
      |</div>
      |<div id="ads-sidebar-back-right" class="ads-sidebar-back-right-css" role="complementary">
      |       |<div class="ads-sidebar-back-right-css">
      |       |       |<div class="ads300-600">
      |       |       |       |<div class="ad-cell">
      |       |       |       |</div>
      |       |       |</div>
      |       |</div>
      |</div>

From W3.org validator I have:

Info: The Content-Type was text/html. Using the HTML parser.
Info: Using the schema for HTML with SVG 1.1, MathML 3.0, RDFa 1.1, and ITS 2.0 support.
Error: Duplicate attribute prefix.
At line 2, column 57
.me/ns#" prefix="og: http://og
Error: A meta element with an http-equiv attribute whose value is X-UA-Compatible must have a content attribute with the value IE=edge.
From line 61, column 1; to line 61, column 64
</script>↩<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />↩<meta
Error: End tag div seen, but there were open elements.
From line 330, column 3; to line 330, column 8
</div>	↩		</div>	↩			<
Error: Unclosed element nav.
From line 267, column 10; to line 267, column 54
↩									<nav id="main-nav" class="fade-in animated2">↩				<
Error: Stray end tag nav.
From line 331, column 4; to line 331, column 9
/div>	↩			</nav><!-- .
Error: The align attribute on the div element is obsolete. Use CSS instead.
From line 333, column 3; to line 333, column 35
er /-->↩		<div class="clear" align="right"><span
Warning: Empty heading.
From line 1281, column 113; to line 1281, column 116
dget-top"><h4> 		</h
Error: The scrolling attribute on the iframe element is obsolete. Use CSS instead.
From line 1283, column 5; to line 1283, column 366
box">↩				<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/Peoples.Repub…order="0" style="border:none; overflow:hidden; width:300px; height:250px;" allowTransparency="true"></ifra
Error: The frameborder attribute on the iframe element is obsolete. Use CSS instead.
From line 1283, column 5; to line 1283, column 366
box">↩				<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/Peoples.Repub…order="0" style="border:none; overflow:hidden; width:300px; height:250px;" allowTransparency="true"></ifra
Error: The allowtransparency attribute on the iframe element is obsolete. Use CSS instead.
From line 1283, column 5; to line 1283, column 366
box">↩				<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/Peoples.Repub…order="0" style="border:none; overflow:hidden; width:300px; height:250px;" allowTransparency="true"></ifra
Error: The align attribute on the div element is obsolete. Use CSS instead.
From line 1409, column 1; to line 1409, column 68
</script>↩<div align="center"  style=" text-align:center; position:relative;"><span

None of the above seems to be related to those two areas…

I’m in a dead-end right now, so please give me some suggestion what should I look for and try.

Regards,
Ivan