সিএসএস - ডিভিড থাকা নীচে থেকে ডিভিশন পজিশন


118

আমি কীভাবে ডিভ যুক্ত ডিভের নীচে একটি ডিভিশন করতে পারি?

<style>
.outside {
    width: 200px;
    height: 200px;
    background-color: #EEE; /*to make it visible*/
}
.inside {
    position: absolute;
    bottom: 2px;
}
</style>
<div class="outside">
    <div class="inside">inside</div>
</div>

এই কোডটি পৃষ্ঠার নীচে পাঠ্যটি "ভিতরে" রাখে।


6
.outside চাহিদাposition: relative;
অনুজ্ঞাসূচক

আপেক্ষিক, হ্যাঁ, এবং তারপরে এটি জানে না যে চাইল্ড-ডিভ বিষয়বস্তু ধরে রাখার জন্য এটি কতটা বড় হওয়া দরকার, দুর্ভাগ্যবশত, সুতরাং যদি না এটি স্থির-মান না হয় তবে মূল প্রশ্নে ফিরে আসুন। কীভাবে একটি ডিভকে অন্য ডিভের নীচে স্থাপন করা যায় (বোঝানো হয়েছে: "সমস্ত কিছু না ভাঙ্গিয়ে")।
জোসেফকে

উত্তর:


136
.outside {
    width: 200px;
    height: 200px;
    background-color: #EEE; /*to make it visible*/
}

করা প্রয়োজন

.outside {
    position: relative;
    width: 200px;
    height: 200px;
    background-color: #EEE; /*to make it visible*/
}

পরম অবস্থানটি ডিওএম-র মধ্যে নিকটতম তুলনামূলক অবস্থানযুক্ত পিতামাতার সন্ধান করে, যদি কোনও এটি সংজ্ঞায়িত না করা হয় তবে এটি শরীর ব্যবহার করবে।


ধন্যবাদ। কেন আপনি ব্যাখ্যা করতে পারেন?
nagy.zsolt.hun

37
absoluteনিকটতম relativeপিতামাতার জন্য অনুসন্ধান । ডিফল্টরূপে এটি bodyএর document। তাই আপনি যদি কোন পিতা বা মাতা করে DOM বস্তু ( .outside) হচ্ছে সম্পত্তি হয়েছে relativeআপনার .insideশরীর ট্যাগ নীচে যাবে।

6
" নিখুঁত অবস্থানটি ডিওএমের মধ্যে নিকটতম তুলনামূলক অবস্থানযুক্ত পিতামাতার সন্ধান করে, যদি এটির সংজ্ঞা না দেওয়া হয় তবে এটি শরীর ব্যবহার করবে " "আপনি কেবল আমার জন্য এত কিছু ব্যাখ্যা করেছেন ! এখন আমি সত্যিই সিএসএস বুঝতে শুরু করি। ধন্যবাদ!
সাইমন ফারসবার্গ

পরম প্রকৃতপক্ষে নিকটস্থ অ-ডিফল্ট (= স্থিতিশীল) অবস্থানযুক্ত পূর্বপুরুষের সন্ধান করে যা প্রায়শই তুলনামূলকভাবে অবস্থান করে। এটি সরাসরি পিতা বা মাতা হতে হবে না তবে উদাহরণস্বরূপ একজন দাদা বাবা হতে পারে।
mzwaal

1
এটি স্থির উচ্চতাগুলির উপর নির্ভর করে, যা খুব খারাপ। হরফ, ফন্টের আকার, প্যাডিং, মার্জিন এবং godশ্বরের একটি সাধারণ পরিবর্তন নতুন উচ্চতা অনুমান করার জন্য পরীক্ষার জন্য আর কি দাবি করে knows
অ্যান্ডারসন

73

বরাদ্দ করুন position:relativeথেকে .outside, এবং তারপর position:absolute; bottom:0;আপনার টু .inside

তাই ভালো:

.outside {
    position:relative;
}
.inside {
    position: absolute;
    bottom: 0;
}

এটি কি স্টিকি ফুটারের ভিত্তি হতে পারে?
ক্যাড গ্যাল্ট

1
আমি অবস্থান ব্যবহার করতে পারি না: পরম; দ্বিতীয় বিভাগের জন্য। এটা আমার নিষেধাজ্ঞা, আপনি আমাকে অন্য বিকল্প দিতে পারেন?
পীযূষ ধোলারিয়া

20

যোগ position: relativeকরুন .outside। ( https://developer.mozilla.org/en-US/docs/CSS/position )

যে উপাদানগুলি তুলনামূলকভাবে অবস্থান করে থাকে সেগুলি এখনও নথিতে উপাদানগুলির স্বাভাবিক প্রবাহ হিসাবে বিবেচিত হয়। বিপরীতে, একটি উপাদান যা একেবারে অবস্থিত থাকে সেগুলি প্রবাহের বাইরে নিয়ে যায় এবং এভাবে অন্যান্য উপাদান রাখার সময় কোনও স্থান নেয় না। একেবারে অবস্থানযুক্ত উপাদানটি নিকটস্থ অবস্থানীয় পূর্ব পুরুষের তুলনায় অবস্থানযুক্ত। যদি অবস্থিত পূর্বপুরুষ উপস্থিত না থাকে তবে প্রাথমিক পাত্রে ব্যবহৃত হয়।

"প্রাথমিক পাত্রে" হবে <body>, তবে উপরের সংযোজন স্থিত করে তোলে .outside

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.