Removing breaks from my css code...

Discussion in 'CSS' started by smeare, Jan 6, 2007.

  1. #1
    I am trying to remove these line breaks that the p1 class is giving me but I need to keep the p1 class. Hope that makes sense. Here is my css

    #menu {position:relative; top:10px; left:100px; width:75px; background-color:#fff; z-index:100;}
    #menu a.p1, #menu a.p1:visited {display:block; width:75px; height:75px; text-decoration:none; background:#fff; top:0; left:0; border:0;}
    #menu a img {border:0;}
    #menu a.p1:hover {text-decoration:none; background-color:#8c97a3; color:#000;}
    #menu a .large {display:block; position:absolute; width:1px; height:1px; border:0px; top:-1px; left:-1px;}
    #menu a.p1:hover .large {display:block; position:absolute; top:-60px; left:150px; width:300px; height:300px; border:10px solid #fff;}
    
    #info {z-index:100; height:22em;}
    Code (markup):
    And here is the html

    <div id="menu"> 
    <a class="p1 "href="#nogo" title="thumbnail image"><img src="images/tocean.gif" title="Thumbnail image" alt="Thumbnail image" /><img class="large"  src="images/ocean.gif" title="Enlarged view of image" alt="Enlarged view of image" /></a>
    <a class="p1 " href="#nogo" title="thumbnail image"><img src="images/tocean.gif" title="Thumbnail image" alt="Thumbnail image" /><img class="large"  src="images/ocean.gif" title="Enlarged view of image" alt="Enlarged view of image" /></a>
    <a  class="p1 " href="#nogo" title="thumbnail image"><img src="images/tocean.gif" title="Thumbnail image" alt="Thumbnail image" /><img class="large"  src="images/ocean.gif" title="Enlarged view of image" alt="Enlarged view of image" /></a>
    <a  class="p1 "href="#nogo" title="thumbnail image"><img src="images/tocean.gif" title="Thumbnail image" alt="Thumbnail image" /><img class="large"  src="images/ocean.gif" title="Enlarged view of image" alt="Enlarged view of image" /></a>
    </div>
    
    HTML:
    Thanks in advance
     
    smeare, Jan 6, 2007 IP
  2. smeare

    smeare Active Member

    Messages:
    261
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    78
    #2
    I got it. This little snipet did the trick
    #menu a.p1 {display: inline;}
    Code (markup):
    Thanks
     
    smeare, Jan 6, 2007 IP
  3. Lichurec

    Lichurec Peon

    Messages:
    61
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Lichurec, Jan 6, 2007 IP