SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Enthusiast Sarah Bellum's Avatar
    Join Date
    Jan 2009
    Location
    Danville, California
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question I want to suppress the newline for block level elements

    I have these image popups which must be anchored to a block level element so that they position correctly. This means that the line containing the link, gets a newline which I don't want. If I try to "display: inline;" the anchor point is lost and the image displays incorrectly. LINK The link is the last line on the page (every page has one), but I don't like that extra space above it. I am sure there is a simple fix to this problem and I'm also sure you guys know what it is ... Thanks!

    Jack

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,807
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The space you are talking about is probably either margins or padding or both.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Enthusiast Sarah Bellum's Avatar
    Join Date
    Jan 2009
    Location
    Danville, California
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, but I don't know how to get rid of it.

  4. #4
    SitePoint Enthusiast Sarah Bellum's Avatar
    Join Date
    Jan 2009
    Location
    Danville, California
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've been told that all block level elements generate a newline and indeed, the element that I am using is the <p> tag. I am sure there must be a better way to do this, but I don't know how. Every block level element I use generates the newline which I don't want.

    I have this feeling that there is a really simple way to do this which I can't see.

    Thanks

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,567
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Just don't do a block element then . Use a <span> (or you could set display:inline; for the <p> in the CSS)

    Alternatively, float it, although I doubt this is the best option (I haven't seen the page to know for sure)
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  6. #6
    SitePoint Enthusiast Sarah Bellum's Avatar
    Join Date
    Jan 2009
    Location
    Danville, California
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The problem with that idea (which I have tried) is that the image becomes unlocked from the left hand side of the screen and starts instead where the inline element starts, in the middle somewhere.

    Thanks though ...

  7. #7
    Ripe Tomatos silver trophybronze trophy Rayzur's Avatar
    Join Date
    Jun 2007
    Location
    Texas
    Posts
    4,174
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Hi,
    I remember helping you get that pop up working a while back.

    As Stephen said it is the default margin on that #pix p. You have that being styled from internal css in the html. You should be able to go ahead and move them to your css file.

    Just add margin:0 to the p
    Code:
    #pix a img.hid {
    width: 322px; height: 238px;
    position: absolute; top: -290px; left: 15px;
    visibility: hidden;}
    
    #pix p {
    margin:0;
    position: relative;
    font-weight: normal;
    font-style: normal;
    }

  8. #8
    SitePoint Enthusiast Sarah Bellum's Avatar
    Join Date
    Jan 2009
    Location
    Danville, California
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Talking

    Thank you Rayzur. You nailed it !!! And so simple too. I knew it would have a simple fix and you did it ... AGAIN Thanks ever so much.

    Jack


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
  •