[Solved]-what is wrong with my code ? java script chart position-Chart.js

you use css id(#) selector, but you have class(.)es on your div's. change classes to ids.

<div id="bar">

    <label for="mychart">
        bar chart title <br />
        <canvas id="mychart" width="300" height="250"></canvas>
    </label>
</div>


<div id="pie">
    <label for="mypiechart">
        pie chart title<br />
        <canvas id="mypiechart" width="250" height="250"></canvas>
    </label>
</div>

or change style's selectors to classes (use .).

.bar {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

.pie {
    position: absolute;
    left: 500px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

example

#bar {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

#pie {
    position: absolute;
    left: 500px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

<div id="bar">
    <label for="mychart">
        bar chart title <br />
        <canvas id="mychart" width="300" height="250"></canvas>
    </label>
</div>


<div id="pie">
    <label for="mypiechart">
        pie chart title<br />
        <canvas id="mypiechart" width="250" height="250"></canvas>
    </label>
</div>