ورود

View Full Version : مشکل در قرار دادن دایو روی دایو دیگر



mahdivita
سه شنبه 18 شهریور 1393, 19:15 عصر
سلام
من یه مربع دارم و یه مربع قرمز رنگ کوچیکم داخلش هست که باید گوشه سمته راست بالا باشه و یه مستطیل هم دارم که باید گوشه سمت راست پایین باشه که با این قضیه مشکل دارم
البته با مارجین تونستم درست کنم اما 200-230پیکسل دادم تا درست شد که منطقی نیست
ممنون میشم کمک کنید

http://jsfiddle.net/p3oxyk25/

mahdivita
چهارشنبه 19 شهریور 1393, 13:11 عصر
واقعا کسی نیست؟؟

mahdivita
چهارشنبه 19 شهریور 1393, 14:19 عصر
آقا چرا کسی جواب نمیده؟؟؟؟
یه مشکل دیگه که هست اینه که کد نوشتم که وقتی ماوس رفت رو پست عکس زوم بشه اما وقتی زوم میشه اون مربع و مسطیل روی پست میرن
چی کنم اونا سر جاشون بمونن
http://jsfiddle.net/yfpu8fz3/1/

پیام حیاتی
چهارشنبه 19 شهریور 1393, 14:58 عصر
سلام
من یه مربع دارم و یه مربع قرمز رنگ کوچیکم داخلش هست که باید گوشه سمته راست بالا باشه و یه مستطیل هم دارم که باید گوشه سمت راست پایین باشه که با این قضیه مشکل دارم
البته با مارجین تونستم درست کنم اما 200-230پیکسل دادم تا درست شد که منطقی نیست
ممنون میشم کمک کنید

http://jsfiddle.net/p3oxyk25/

سلام
چی منطقی نیست!
چطور میخواین جا به جا کنید پس؟!

پیام حیاتی
چهارشنبه 19 شهریور 1393, 15:01 عصر
آقا چرا کسی جواب نمیده؟؟؟؟
یه مشکل دیگه که هست اینه که کد نوشتم که وقتی ماوس رفت رو پست عکس زوم بشه اما وقتی زوم میشه اون مربع و مسطیل روی پست میرن
چی کنم اونا سر جاشون بمونن
http://jsfiddle.net/yfpu8fz3/1/
z-index برای کلاس یا آدیشون قرار بده مقدارشم بزار 1000،اگر کار نکرد به تصویرت هم z-index بده مقدارش رو کمتر از اشکالت بزار مثلا بزار 100.

Mori Bone
چهارشنبه 19 شهریور 1393, 15:27 عصر
برای سوال اولتون به هر دو تا دیو position: absolute بده و به به دیو بالا سمت راست کده اول و به دومی کده دومی رو بده:
#topright {
top: 0px;
right: 0px;
}


#topleft {
bottom: 0px;
right: 0px;
}



اینم سوال دومتون:
<section class="post">
<div class="icon-post">
</div>
<div class="text-post">
<h3>آهنگ با اینکه تنهایی محمد علیزاده</h3>
</div>
<img src="http://0up.ir/up8/guest/9-cover.jpg" alt=""/>
</section>

.post{ width:300px;
height:300px;
background-color:#666;
float:right;
margin: 0 10px 12px 4px;
border:3px solid rgba(255,255,255,0.1);
-webkit-transition: all ease-out 0.5s;
-moz-transition: all ease-out 0.5s;
-ms-transition: all ease-out 0.5s;
-o-transition: all ease-out 0.5s;
transition: all ease-out 0.5s;
overflow:hidden;
position: relative;
}
.post:hover .icon-post{
opacity:1;
}
.post:hover .text-post{
opacity:1;
}
.icon-post{
position: absolute;
z-index: 1;
background-color:#e85050;
width:55px;
height:55px;
background-image:url(../img/img.png);
background-repeat:no-repeat;
background-position: -1px 6px;
position: absolute;
opacity:0.5;
-webkit-transition: all ease-out 0.5s;
-moz-transition: all ease-out 0.5s;
-ms-transition: all ease-out 0.5s;
-o-transition: all ease-out 0.5s;
transition: all ease-out 0.5s;
}
.icon-post:hover{
opacity:1;
}
.text-post{
width: 200px;
padding: 10px;
background-color: rgba(51,51,51,0.7);
position: absolute;
margin-top: 200px;
opacity:0.6;
-webkit-transition: all ease-out 0.5s;
-moz-transition: all ease-out 0.5s;
-ms-transition: all ease-out 0.5s;
-o-transition: all ease-out 0.5s;
transition: all ease-out 0.5s;
position: absolute;
z-index: 1;
}
.text-post:hover{
opacity:1;
}
.text-post h3{
color:#FFF;
font-weight: 100;
}
.post > img {
position: absolute;
z-index: 0;
}
.post:hover img{

-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
-webkit-transition: all ease-out 0.5s;
-moz-transition: all ease-out 0.5s;
-ms-transition: all ease-out 0.5s;
-o-transition: all ease-out 0.5s;
transition: all ease-out 0.5s;
}

mahdivita
چهارشنبه 19 شهریور 1393, 17:19 عصر
سلام
دمتون گرم :قلب:

vimax23
چهارشنبه 19 شهریور 1393, 17:50 عصر
آقا برای خودت میگم به دیو نگو دایو
div = دیو

mahdivita
پنج شنبه 20 شهریور 1393, 14:44 عصر
آقا من اینکار رو کردم
#topleft {
bottom: 0px;
right: 0px;
} اما باز هم نشدش

Mori Bone
پنج شنبه 20 شهریور 1393, 22:03 عصر
آقا من اینکار رو کردم
#topleft {
bottom: 0px;
right: 0px;
} اما باز هم نشدش
به جفتشون کده زیر رو بده:
position: absolute;