Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Senior Member mikeycorn's Avatar
    Join Date
    Mar 2003
    Posts
    272
    Member #
    891
    I'm using a lot of <p class= to set my styles and it works perfect, except for one instance where there's one style of text and on the very next line a different style.

    How do I get two styles inside the same <p></p>
    ~ mikeycorn
    With over 72,000 questions worth of user submitted quizzes, it's the world's most popular quiz creation software:
    PEST - The Personal Exam Self-Tester

  2.  

  3. #2
    Senior Member Rince's Avatar
    Join Date
    Nov 2004
    Posts
    183
    Member #
    8318
    Assuming you are after something like:
    Code:
    <p class="one">Some text here. <br />
    <span class="two">More text.</span></p>
    However, You should make skant use of the br tag. You can easily get rid of the padding before and after paragraphs by setting the css just so. Thus you should really use
    Code:
    .one {margin-bottom:0px;}
    .two {margin-top:0px;}
    
    <p class="one">Some text here.</p>
    <p class="two">More text.</p>

  4. #3
    Senior Member Fallout's Avatar
    Join Date
    Aug 2003
    Location
    Richmond, Virginia
    Posts
    543
    Member #
    2748
    If you are just doing the first line you can set a style for p:first-line to always bold it for example, however this only works on Safari and Gecko browsers.

    If you want IE support, you just have to do different classes.

  5. #4
    Senior Member mikeycorn's Avatar
    Join Date
    Mar 2003
    Posts
    272
    Member #
    891
    Thanks for taking the time to answer.

    Great, that second route looks like a better approach, I'm curious though, the first approach was actually what I was trying and I couldn't get it to work. Here's what I had in the html:

    Code:
    	<p class="subtitle">OPTIONAL CEREMONIES<br>
    	    <span class="aqua">What your guests see far outweighs
    		what they hear.
    	    </span>
    	</p>
    here's the code in my .css file

    Code:
    p.subtitle {
    	font-family: Arial, Helvetica, sans-serif; color: #8D498D;
    	font-size: 14px; font-weight: bold; 
    }
    
    p.aqua {
    	font-family: Arial, Helvetica, sans-serif; color: #008080;
    	font-size: 12px; text-align: justify;
    }
    I tried them both with the .p and without. Any idea why my span class wasn't working?
    ~ mikeycorn
    With over 72,000 questions worth of user submitted quizzes, it's the world's most popular quiz creation software:
    PEST - The Personal Exam Self-Tester

  6. #5
    Senior Member mikeycorn's Avatar
    Join Date
    Mar 2003
    Posts
    272
    Member #
    891
    Woo hoo! Thanks Rince, the second suggestion works great. Still curious about what I was doing wrong with the span class, but I like that second solution much more.
    ~ mikeycorn
    With over 72,000 questions worth of user submitted quizzes, it's the world's most popular quiz creation software:
    PEST - The Personal Exam Self-Tester

  7. #6
    Senior Member Rince's Avatar
    Join Date
    Nov 2004
    Posts
    183
    Member #
    8318
    p.aqua does not match <span class="aqua"> - you should have used just .aqua or else span.aqua

    Looking at your example, The first line looks more like a headline than a paragraph. So this would be more symaticly correct.
    Code:
    <h2 class="subtitle">OPTIONAL CEREMONIES</h2>
    <p class="aqua">What your guests see far outweighs
    what they hear.</p>
    There are of course h1, h2, h3, h4 etc depending how major this headline is. but the healdine tags should be used where applicable.

    As with the span, the css would be h2.subtitle or just .subtitle


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:12 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com