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 2 of 2
Like Tree1Likes
  • 1 Post By sasha_bolcina

Thread: CSS image hover positioning

  1. #1
    Senior Member kirman's Avatar
    Join Date
    May 2003
    Location
    UK England
    Posts
    765
    Member #
    1499
    Liked
    2 times

    Question CSS image hover positioning

    hi all,

    im adding a facebook and twitter image to my page, they rollover when highlighted with liks to the elevent pages.

    The problem is when I add my class to them they go 1 above the other. causing my page to go mental and I would like them side by side. Hopefully you guys will provide a quick solution.

    CSS

    Code:
    .facebook1  {
     height: 30px;
     width: 34px;
     background: url(images/header/facebookh.jpg) no-repeat;
    }
    .facebook1 a, .facebook1 a:link, .fb2 a:visited {
      display:inline;
      width: 34px;
      height: 30px; 
    }
    .facebook1 a:hover img {
      visibility:hidden;
      border:0px;
      height:30px;
      width:34px;
    }
    .twitter1  {
     height: 30px;
     width: 34px;
     background: url(images/header/twitterh.jpg) no-repeat;
    }
    .twitter1 a, .twitter1 a:link, .fb2 a:visited {
      display:inline;
      width: 34px;
      height: 30px; 
    }
    .twitter1 a:hover img {
      visibility:hidden;
      border:0px;
      height:30px;
      width:34px;
    }
    The HTML that houses them.

    HTML Code:
        <div class="headerphotocon"></div>
      <div class="navbar2">
            <div class="facebook1">
            <A href="http://www.facebook.com/jkmagician">
            <img src="images/header/facebook.jpg" width="34" height="30" style="border:0px;" /></a>
            </div>
            <div class="twitter1">
            <A href="http://www.twitter.com/JK_Magician">
            <img src="images/header/twitter.jpg" width="34" height="30" style="border:0px;" /></a>
            </div>  
      <div class="index"><div class="jkmagician">
      <div class="subtitleblack">HOME / <span class="subtitleblue">CONTACT</span></div>
    Thanks again.
    Dream like you'll live forever. Live like you're gonna die 2morrow!

  2.  

  3. #2
    Senior Member sasha_bolcina's Avatar
    Join Date
    Sep 2014
    Location
    Serbia
    Posts
    274
    Member #
    40099
    Liked
    47 times
    .facebook1, .twitter1 {
    display: inline-bock;
    }

    OR
    .facebook1, .twitter1 {
    float: left;
    }


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 02:52 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com