Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Aug 2013
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Question HTML span not just affecting content within span

    Hi,
    I have a very simple question, I'm sure, but I'm new to this and I'm at my wits' end trying to fix it!
    I'm writing a contact page for a Spanish website, and I want to target just the words 'encuentranos', 'llamanos' and 'contactanos' in the html below. To that end I put a span tag around them and defined them as the class 'contacttype'. I want them to be bigger, that's all, 2em instead of 1em for the rest. For some reason, all the paragraphs become size 2em. I've tested this by adding in a COLOR:RED; in the css and I can see all the text change colour. What am I missing here? Are the <br> tags having some kind of effect?
    Many thanks in advance.

    Code:
     
    .contactodetalles {
    	text-align: center;
    	width: 380px;
    	float: left;
    	background: #f3faff;
    	padding: 20px;
    	border-radius: 20px;
    	font-size: 1em;
    }
    
    .contacttype {
    	font-size: 2em;
    }
    HTML:
    Code:
    <div class="contactodetalles">
    				<p
    				   <span class="contacttype">¡Encuéntranos!</span><br>Calle Virgen del Rocío, 13,<br>41309, La Rinconada,<br>SEVILLA
    				</p>
    				<p
    				   <span class="contacttype">¡Llámanos!</span><br>954 65 44 56
    				</p>
    				<p
    				   <span class="contacttype">¡Contáctanos!</span><br>info@iamingles.es
    				</p>
    			</div>

  • #2
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,226
    Thanks
    10
    Thanked 269 Times in 268 Posts
    You're missing a bunch of closing brackets, that might have something to do with it:
    Code:
    <div class="contactodetalles">
    				<p>
    				   <span class="contacttype">¡Encuéntranos!</span><br>Calle Virgen del Rocío, 13,<br>41309, La Rinconada,<br>SEVILLA
    				</p>
    				<p>
    				   <span class="contacttype">¡Llámanos!</span><br>954 65 44 56
    				</p>
    				<p>
    				   <span class="contacttype">¡Contáctanos!</span><br>info@iamingles.es
    				</p>
    			</div>

  • Users who have thanked tracknut for this post:

    laptopcomputer (08-26-2013)

  • #3
    New to the CF scene
    Join Date
    Aug 2013
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Well that's embarrassing. I've spent AGES looking at this. Thanks a lot!

  • #4
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,226
    Thanks
    10
    Thanked 269 Times in 268 Posts
    No worries. If you're spending more than 10 minutes on errors, keep this bookmarked: http://validator.w3.org/ - it is *the* html code validator, and should be something you check your code against often.

    Dave


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •