मैंने मार्जिन और सीमा को 0 पर सेट करने का प्रयास किया है, लेकिन अभी भी काम नहीं कर रहा है।दो छवियों के बीच मार्जिन को कैसे हटाया जाए?
<style type="text/css">
img {margin:0;}
</style>
<body>
<img src="/static/btnNext.gif" border="0" />
<img src="/static/btnSave.gif" border="0" />
दो छवियां एक-दूसरे के करीब कैसे रहें?
आप छवि के लिए सीएसएस को खत्म कर सकते हैं और बिना किसी स्थान के छवि टैग को उसी पंक्ति पर रख सकते हैं।
<img src="/static/btnNext.gif" border="0" /><img src="/static/btnSave.gif" border="0" />
+1 में कोई अनुशंसित उपयोग फ्लोट नहीं है इस मामले में सही उत्तर क्योंकि यह कोई साइड इफेक्ट नहीं करता है (क्या 'फ्लोट: बाएं' और 'डिस्प्ले: ब्लॉक' डू)। –
@jeerose +1, धन्यवाद! @ मैक: एफएफ 3.6 और सफारी पर DOCTYPE का उपयोग करके आपका उदाहरण पूरी तरह से काम करता है और छवियों के बीच नई लाइनें इग्नोर हैं! एक अपवाद (सामान्य के रूप में) obvioulsy आईई 7 (IE8 कोशिश नहीं किया गया है) जो इस अजीब व्यवहार को दिखाता है, और एकमात्र कामकाज जेरोस द्वारा सुझाए गए एक प्रतीत होता है। –
<style type="text/css">
img {margin:0; float: left;}
</style>
है के बीच की रेखा वापसी है इस मामले में – GusDeCooL
इस सीएसएस छवियों के बीच किसी भी स्थान, लाइनब्रेक या सीमाओं के बिना eachother के करीब छवियों छड़ी चाहिए ...
<style type="text/css">
img {margin:0px; padding: 0px; float: left;border:0px}
</style>
मैं एक व्यक्ति div होने शैली नाव में प्रत्येक छवि डाल करने के लिए सुझाव है कि :बाएं। ये 2 divs एक पैरेंट div के भीतर संलग्न होना चाहिए जो स्वयं ही फ़्लोट है:
<div style="float:left">
<div style="float:left">
<img src="/static/btnNext.gif" border="0" />
</div>
<div style="float:left">
<img src="/static/btnSave.gif" border="0" />
</div>
</div>
उनके बीच लाइन ब्रेक टिप्पणी करें।
<img src="/static/btnNext.gif" border="0" /><!--
--><img src="/static/btnSave.gif" border="0" />
क्यों? एचटीएमएल कोड स्वरूपण के लिए कई रिक्त स्थान (ब्रेकिंग और गैर दोनों) की अनुमति देता है, लेकिन केवल पहले प्रदर्शित करता है। आपके मामले में, विभिन्न रेखाओं पर होने वाली छवियों को उनके बीच एक जगह के रूप में व्याख्या किया जा रहा है। सबसे आसान समाधान उन्हें एक पंक्ति पर रखना है, लेकिन यह पठनीय नहीं है।
मुझे अभी यह समस्या थी, लेकिन मेरी समस्या का उत्तर नहीं मिला, सबसे पहले मैं नहीं चाहता कि मेरी छवियां बाएं हों; दूसरा, डायप्ले का उपयोग करके: ब्लॉक एक अच्छा विचार नहीं है क्योंकि मैं उन्हें ऑनलाइन चाहता हूं, डिस्प्ले: ब्लॉक ब्लॉक काम नहीं करता है।
समाधान काफी आसान है, "प्रवेश करें" बाहर निकालें और अपनी छवियों को एक ही पंक्ति में रखें। मैं समझाता:
गलत
<img src="flower1.jpg"/>
<img src="flower1.jpg"/>
<img src="flower1.jpg"/>
ठीक
<img src="flower1.jpg"/><img src="flower1.jpg"/><img src="flower1.jpg"/>
तो आशा है कि यह मदद करता है।
यह वही है जो स्वीकार किए गए उत्तर ने 5 साल पहले कहा था। – Gary
एचटीएमएल img टैग के बीच है और उपयोग सीएसएस vertical-align:top
निकालें रिक्त स्थान:
<img src='http://i.imgur.com/wipljF1.png'/>NoSpaces<img src='http://i.imgur.com/wipljF1.png' class='playerpreviewbig'/>NoSpaces<img src='http://i.imgur.com/wipljF1.png' class='playerpreviewbig'/>
सीएसएस:
img {
width: 50px;
height: 50px;
padding: 0;
margin: 0;
vertical-align:top;
}
यह शायद 2 बटन है कि समस्या – dnagirl