» » » » Mobilde div kayma sorunu

Mobilde div kayma sorunu

uykusuzz35
uykusuzz35 21-07-2016, 14:06
Arkadaşlar ilk resimde görüldüğü üzere player yanındaki boş alanı div ile değerlendirdim. Playerı { full-story } kullanarak alıyor. css ve full-story.tpl de bir kaç değişiklik yaparak playerın yanına div ile içerik ekledim. Fakat mobilde yine ikinci resimde görüldüğü üzere div ile içerik eklediğim alan playırın üstüne biniyor. Mobilde bu alanı playerın altına almak istiyorum.

Mobilde div kayma sorunu
Mobilde div kayma sorunu

style.css de playerın olduğu alanın kodu şu şekilde;
.fullfilm .player {
    position:relative;
	margin: 0 -15px;
}

.fullfilm .player_frame {
    position:relative;
	top: 40px;
    left: 30px;
	width: 100%;
	height: 100%;
}
.fullfilm .player_son {
    position:relative;
    margin-left: 20px;
    width: 90%;
    height: 100%;
}
.fullfilm .player_sag {
    position:absolute;
    right: 20px;
    height: 100%;
}


full-story.tpl deki kodlar ise;
<div class="player" style="overflow:hidden;" id="watch">
		<div class="sector_title">
				<span class="title"><span>Fragman <i class="fa fa-video-camera"></i></span></span>
			</div>
			<div class="player_son" style="float:left;">
                {full-story}
        </div>
        <div class="player_sag" style="float:right;"> 
           <script>
/* Megogo rating start */
$(function() {
	var mn = parseInt($("#d-{r-id}").html());
	var pl = parseInt($("#l-{r-id}").html());
	var su = pl + mn;
	var lp = Math.abs(pl/su*100);
	var lm = Math.abs(mn/su*100);
	$("#success-{r-id}").css({width:lp+'%'});
	$("#dangers-{r-id}").css({width:lm+'%'});
});
/* Megogo rating end */
</script>
<div class="ignore-select">
<div class="rating-mg view-ratings">
    <div id="mratesb-{r-id}" class="btn-group vote-buttons">
        <button class="btn like" onclick="rating_like('{r-id}', '1'); return false;" type="button"><span class="icon"></span>İzlenmeli</button>
        <button class="btn dislike" onclick="rating_like('{r-id}', '-1'); return false;" type="button"><span class="icon"></span>Zaman Kaybı</button>
    </div>

    <div class="progress">
        <div id="success-{r-id}" class="bar bar-success"></div>
        <div id="dangers-{r-id}" class="bar bar-danger"></div>
    </div>

    <p class="result clearfix">
        <span class="like"><span id="l-{r-id}" class="count">{r-rp}</span> İzlenmeli</span>
        <span class="dislike"><span id="d-{r-id}" class="count">{r-rm}</span> Zaman Kaybı</span>
    </p>
</div></div><br/><hr />
            <img src="http://www.google-yahoo.com/wp-content/uploads/ac_uploads/2220409.jpg"/>
                </div>
        <div class="clr"></div>
	</div>
</div>


Yardımlarınızı rica ediyorum.

URL:http://www.videpon.com/359-midnight-specials-fimi-izle-fragman.html#watch

Çözüldü İşleme Alındı Bekliyor Çözülemedi
Bilgilendirme
Yorum Ekleyebilmeniz için Sitemize Kayıt Olmanız Gerekmektedir.
0
uykusuzz35 22 Temmuz 2016 15:24
@MaRZoCHi, teşekkür ederim. Konu yayına alınıncaya kadar kendi uğraşlarımla sorunu çözdüm. css de responsive kodlarında değişiklikler yaparak istediğim konuma geldi. İlginiz için teşekkür ederim.
3 779
MaRZoCHi 22 Temmuz 2016 10:58
<br/><hr />

Yerine
<br style="clear:both"/><hr />

Ekleyip deneyin.

--------------------