SitePoint Sponsor

User Tag List

Results 1 to 17 of 17

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2009
    Location
    Toronto
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    <br /> drives me crazy!

    I have a wordpress site and am having incredibly inconsistent and crazy results with the <br /> tag. I put it on one of my pages to create a break, and one minute it works, the next it doesn't. I put it in one html side widget and it works, and put it the same code in another widget, and it doesn't. It goes back and forth like this with no logic. It will suddenly work, and one day one of my pages it will just stop working, out of nowhere, just like that.

    One example below of a widget where the line break works in one widget, but I put the same code in another widget and it doesn't work. It's driving me crazy.

    Any suggestions?

    <br /><p style="text-align: left;"><span style="color: #3e74ac; font-size: 15px; font-family: tahoma,palatino;">Sign up for our newsletter to <span style="color: #3ca328;">receive a free sample</span> from the program.</span></p>
    Mindfulness Anger Management
    http://mindfulnessangermanagement.com
    anger management and beyond

  2. #2
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Hmmm. You have a line break (the <br />) before any of the text (I'm assuming you want a space above the paragraph) and a hot mess of inline CSS and overalapping spans. I know Wordpress doesn't handle HTML/CSS as cleanly as hand-coded designs, but there's a lot of ... stuff going on here. In a way, having the line break not appear as your only problem is not such a bad thing!

    Edit: In light of Ralph's post below, it might have been good for me to actually address the problem rather than just sniping at the code...

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,176
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    You shouldn't be using <br> between block elements, but within them—and then only rarely. Instead, you should be using padding and/or margins to visually separate items—or, in other words, CSS.

    Most of the time there is a better option than the br element.

  4. #4
    Chive On FFCus's Avatar
    Join Date
    Feb 2006
    Location
    Connecticut
    Posts
    542
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not sure about the widgets, but their structure may be stopping your line break from working. As a test (although not a best practice) try

    Code:
     <br clear="all" /><br />

  5. #5
    SitePoint Enthusiast
    Join Date
    Jul 2009
    Location
    Toronto
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks everyone for your help. I tried using the margin within the paragraph style but had no luck. Maybe the code is so messed up that nothing is working now.

    Is there anywhere you can recommend where I could learn how to do this? I tried w3 schools but don't see what I need there. I understand how to make changes to my style.css file - somewhat - but don't know how to do the code for widgets or pages on my wordpress site.
    Mindfulness Anger Management
    http://mindfulnessangermanagement.com
    anger management and beyond

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,176
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Try something like

    HTML
    Code:
    <p class="news">Sign up for our newsletter to <span>receive a free sample</span> from the program.</p>
    CSS
    Code:
    .news {
      color: #3e74ac; 
      font-size: 15px; 
      font-family: tahoma,palatino, serif;
      margin-top: 30px;
    }
    
    .news span {
      color: #3ca328;
    }


Bookmarks

Posting Permissions

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