css - কিভাবে html তৈরি করা যায়




আমি কিভাবে একটি div একটি SVG কেন্দ্র করবেন? (6)

আপনার CSS পঠন নিশ্চিত করুন:

margin: 0 auto;

যদিও আপনি বলছেন যে আপনার বাম এবং ডান দিকে স্বয়ং সেট আছে তবে আপনি একটি ত্রুটি স্থাপন করতে পারেন। অবশ্যই আমরা জানি না কারণ আপনি আমাদের কোনও কোড দেখাননি।

আমার একটি এসভিজি আছে যা আমি একটি ডিভিতে কেন্দ্রীভূত করার চেষ্টা করছি। Div একটি প্রস্থ বা 900px আছে। এসভিজি 400 পিএক্স একটি প্রস্থ আছে। এসভিজি এর মার্জিন-বাম এবং মার্জিন-ডান স্বয়ং সেট আছে। কাজ করে না, বাম মার্জিনটি 0 (ডিফল্ট) হিসাবে কাজ করে।

যে কেউ আমার ভুল জানেন?


আপনি এটি করতে পারেন:

<center>
<div style="width: 40px; height: 40px;">
    <svg class="sqs-svg-icon--social" viewBox="0 0 64 64">
        <use class="sqs-use--icon" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#twitter-icon">
            <svg id="twitter-icon" viewBox="0 0 64 64" width="100%" height="100%">
                <path
                    d="M48,22.1c-1.2,0.5-2.4,0.9-3.8,1c1.4-0.8,2.4-2.1,2.9-3.6c-1.3,0.8-2.7,1.3-4.2,1.6 C41.7,19.8,40,19,38.2,19c-3.6,0-6.6,2.9-6.6,6.6c0,0.5,0.1,1,0.2,1.5c-5.5-0.3-10.3-2.9-13.5-6.9c-0.6,1-0.9,2.1-0.9,3.3 c0,2.3,1.2,4.3,2.9,5.5c-1.1,0-2.1-0.3-3-0.8c0,0,0,0.1,0,0.1c0,3.2,2.3,5.8,5.3,6.4c-0.6,0.1-1.1,0.2-1.7,0.2c-0.4,0-0.8,0-1.2-0.1 c0.8,2.6,3.3,4.5,6.1,4.6c-2.2,1.8-5.1,2.8-8.2,2.8c-0.5,0-1.1,0-1.6-0.1c2.9,1.9,6.4,2.9,10.1,2.9c12.1,0,18.7-10,18.7-18.7 c0-0.3,0-0.6,0-0.8C46,24.5,47.1,23.4,48,22.1z"
                    />
            </svg>
        </use>
    </svg>
</div>
</center>

আমি ব্যবহার ছিল

display: inline-block;

উপরোক্ত উত্তর আমার জন্য কাজ করে না। বৈশিষ্ট্যাবলী preserveAspectRatio="xMidYMin" হচ্ছে preserveAspectRatio="xMidYMin" <svg> ট্যাগে যদিও কৌশলটি ছিল। viewBox এ্যাট্রিবিউটের পাশাপাশি কাজ করার জন্য এটি নির্দিষ্ট করতে হবে। উত্স: মোজিলা ডেভেলপার নেটওয়ার্ক


এই উত্তর কেউ আমার জন্য কাজ। এই আমি এটা কিভাবে।

position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);

যে svg ডিফল্টরূপে ইনলাইন উপরে পড়া হচ্ছে, আমি শুধু div যোগ নিম্নলিখিত:

<div style="text-align:center;">

এবং এটা আমার জন্য কৌশল ছিল।

Purists এটা পছন্দ করতে পারে না (এটি একটি ছবি, টেক্সট নয়) কিন্তু আমার মতে এইচটিএমএল এবং CSS কেন্দ্রীভূত উপর screwed, তাই আমি মনে করি এটা ন্যায্য।







margin