Need a little CSS help with 'Welcome Guest' please.

Discussion in 'TemplateCodes' started by michael, Nov 21, 2011.

  1. michael Just get on with it!

    I really have tried :eek:

    I'm using the (brilliant) Sigma template but I'd just like to move the 'Welcome Guest' Login & Register links down a bit. Using Firebug I've determined that this is controlled by #layoutdims in the main style.css file.

    However, any changes I make there will also affect the logo image as that div inherits the same properties. (Hope I've explained that correctly.) If I could get a pointer in the right direction I'd be really grateful.

    Appreciatively,

    Michael

    Attached Files:

  2. Mike-N-Tosh Owner

    I can't say for sure and it's been a while since I used that template for any of my clients.

    Depending on how the divs are actually structured will dictate how to address the issue. If the logo and the layout dims are separate divs contained in another div, then you should be able to simply add a margin-top declaration or, make the enclosing div, position: relative;, then also make the layout dim also position relative and then declare top:xxxpx to move it down.
  3. michael Just get on with it!

    Ah! Thanks Mike, that makes sense. I'll let you know how I get on . . .

    Ta
  4. seymourjames All Hands On Deck

    Assuming your are not using the social bookmarks. Try putting the html code

    Welcome Guest: <a href="http:/ ......... <img src="templates/Sigma-Navy/images/layout/feed.png" alt="rss feed"></a>

    into the

    <div id="bookmarks">

    // here and delete the bookmarks or move them somewhere else

    </div>

    Then adjust your css selector by putting a bit of margin-top if you want to push it down. This worked for me on my demo system.

    #bookmarks {
    float:right;
    margin-top:35px;
    }
  5. michael Just get on with it!

    Hi David

    I've checked your demo site.

    I think I must be using an earlier version of Sigma as my CSS folder does not contain the 'layout' folder holding the structure.css file - thus no #bookmarks or <div id="bookmarks">

    I'm really happy with my site and am not inclined to upgrade unless I really have to. If there's a way to effect this change on the older Sigma that'd be great otherwise I'll just leave it as it is - it's only an aesthetic change after all.

    Many thanks for your time,

    Michael
  6. seymourjames All Hands On Deck

    This works for me in Firefox on you site. Play around with the css selector until you have it in the position you want. I did this quickly and i am sure it can be done better.

    #layoutdims {
    padding:15px 0px 0px 180px;
    float:right;
    }


    Then in layout.tpl

    <div id="header">
    <div id="logo">
    <a href="http://www.domain.co.uk/" title="xxxx"><img src="photos/logo_logo2.png" alt=xxxxxxx"></a>

    <div id="layoutdms">
    Welcome Guest: <a href="http://www.domain.co.uk/login.php" class="icon_login" title="">Login</a> <a class="icon_register" href="http://www.domain.co.uk/userjoin.php" title="" rel="nofollow">Register</a>
    </div>
    </div>
    <div class="clear"></div>
    </div>


    why don't you change the colours of your menu tabs and their link colour? superfish2.css

    .sf-menu li {
    background: transparent; - set it to a color
    }

    .sf-menu li.first {
    border:0;
    background: #42595C; - set it to the same color
    }

    .sf-menu li:hover,.sf-menu li.sfHover,.sf-menu a:focus,.sf-menu a:hover,.sf-menu a:active{
    background: #769BA1;
    outline: 0;
    color:#EBE886;
    }
  7. michael Just get on with it!

    Many thanks, much appreciated.

    :)

Share This Page