सीएसएस

Question

का उपयोग कर विभिन्न फ़ॉन्ट-आकारों के साथ टेक्स्ट के दो टुकड़ों को लंबवत रूप से संरेखित करें। मेरे पृष्ठ के शीर्ष पर मैं स्क्रीन के दाईं ओर गठबंधन वाले एक छोटे से नेविगेशन मेनू के साथ स्क्रीन के बाईं ओर गठबंधन पृष्ठ का शीर्षक प्राप्त करना चाहता हूं । मैं इसे फ्लोट का उपयोग करके प्राप्त कर सकता हूं लेकिन दोनों तत्वों में अलग-अलग आधार रेखाएं हैं यानी पाठ की आधार रेखा अलग दिखाई देती है। क्या सीएसएस का उपयोग करके काम करने के लिए कोई रास्ता है? मैं क्या मैं मैं एक ul उपयोग करने का सुझाव था बल्कि एक h3 से लिंक रैप करने के लिए पर jsfiddle http://jsfiddle.net/nBPCG/63/

Answer 1

हाय आप डिस्प्ले का उपयोग कर सकते हैं: अपने h1 में इनलाइन-ब्लॉक

या फिडल देखें: - http://jsfiddle.net/nBPCG/101/

Answer 2

सबसे पहले करने का प्रयास कर रहा हूँ का एक नमूना है, कि संरचना मतलब नहीं है। तो मैं ul पर कुछ पैडिंग जोड़ दूंगा।

<article > 
<header> 
    <h1>This is Title</h1> 
    <nav> 
     <ul> 
      <li><a href="">Home</a></li> 
      <li><a href="">Works</a></li> 
      <li><a href="">Blog</a></li> 
      <li><a href="">Contact</a></li> 
     </ul> 
    </nav> 
    <div class="clr"></div> 
</header> 
</article> 

और शैलियों:: यहाँ मार्कअप की एक साफ उदाहरण है

body { 
    font-family:"Verdana", Verdana, sans-serif; 
    font-size: 1em; 
    font-weight:400; 
} 

h1 { 
    font-family:"Century Gothic", Verdana, sans-serif; 
    font-size: 4em; 
    font-weight:400; 
    float: left; 
    margin-left:10px; 
} 

header nav { 
    margin-right: 10px; 
    float: right; 
} 

nav ul { 
    list-style-type: none; 
    margin: 0; 
    padding: 2em 0 0 0; 
} 

nav ul li { 
    display: inline; 
    font-size: 1.2em; 
    font-weight:400; 
} 

nav a { 
    padding: 0 1em; 
    border-right: 1px solid #000; 
} 

nav li:last-child a { 
    padding-right: 0; 
    border-right: none; 
} 

.clr {clear:both;} 

फिडल: http://jsfiddle.net/nBPCG/98/