div class on the same row as another div class?

[johan019]

Hi!

Me again.

Been working with this for some days now and I cant really figure it out, so im reaching out for your help experts.

Here is my problem.

visit.png (4.66 KiB) Viewed 182 times

I want the "Visit Us" on the same row as "My Account" etc.

Here is my header.tpl code:

Code: Select all

<div id="link-holder">
   <div class="links"><a href="<?php echo $home; ?>"><?php echo $text_home; ?></a><a href="<?php echo $wishlist; ?>" id="wishlist_total"><?php echo $text_wishlist; ?></a><a href="<?php echo $account; ?>"><?php echo $text_account; ?></a><a href="<?php echo $cart; ?>"><?php echo $text_cart; ?></a><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a></div>
<div class="fb"><a href="http://www.facebook.com">visit us!</a></div>

</div>

And here is my stylesheet:

Code: Select all

#header .links a {
   font-size: 18px;
   font-family: BebasNeue,Arial,sans-serif;
   display: inline;
   padding: 0px 0px 0px 8px;
   color: #666666;
   text-decoration: none;
        font-weight: normal;
   text-align: center;
}
#header .links  a:hover {
   color: #3190B0;
}   
#header .links a + a {
   margin-left: 8px;
}
#header .fb a {
        margin-left: 50px;
        margin-bottom: 15px;
        font-size: 18px;
   font-family: BebasNeue,Arial,sans-serif;
   display: inline;
   padding: 0px 0px 0px 0px;
   color: #666666;
   text-decoration: none;
        font-weight: normal;
        text-align: right;
}

Note that I dont want the Facebook link to be a part of the link class (my account, wishlist) because I want to be able to edit the Facebook link individual in my stylesheet.

Someone who can pinpoint my problem here?

Would appreciate it very much!
Thanks in advance fellas!

[Tcalp]

You need to be looking at the css defined for link-holder .. it will have a width specified that needs to be increased

[Tcalp]

also ... www.firebug.com <- install this for firefox .. it's a MUST HAVE tool

[johan019]

You need to be looking at the css defined for link-holder .. it will have a width specified that needs to be increased

Thank you for your answer.

Unfortunately I have already tried to increase the width but it wont "jump up" on the right row anyway.
And yes, firebug is installed, but I cant narrow it down anyway.

Any other ideas?

Thank you!

[johan019]

Maybe I need an additional "holder" for my FB link since it is in its own class, not in the "link class"? Would also like to fit in Twitter link, shouldnt be impossible?

Thanks!

[johan019]

*Bump*