Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help layout html code

    Hello,

    I am working on a website www.marketentry.biz by adding html code to the footer via widgets. You can see at the footer that one of the widgets (Exchange Rates) displays a text not aligned with the other two widgets.

    I am looking into the html code and cannot find how to align it to the top so it will be aligned with the text displayed by the other two widgets. Any advice is welcome!

  • #2
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    sorry, here you have the HTML code I pasted inside the widget:

    Code:
    <div style="width:178px;margin:0;padding:0;border:1px solid #FFFFFF;background:#FFFFFF;">
    <div style="width:178px;text-align:center;padding:2px 0px;background:#FFFFFF;font-family:calibri;font-size:11px;color:#FFFFFF;font-weight:bold;vertical-align:middle;">
    <a style="color:#FFFFFF;text-decoration:none;text-transform:uppercase;" href="http://www.exchangerates.org.uk/Euro-EUR-currency-table.html" target="_new" title="Euro">Euro</a>
    </div>
    <div style="padding:5px;text-align:center;">
    <script type="text/javascript">	
    var nb = '4';
    var tz = 'userset';
    var mc = 'EUR';
    var c1 = 'USD';
    var c1 = 'USD';
    var c2 = 'BRL';
    var c2 = 'BRL';
    var c3 = 'GBP';
    var c3 = 'GBP';
    var c4 = 'CHF';
    var c4 = 'CHF';
    var c5 = 'INR';
    var c6 = 'CAD';
    var c7 = 'ZAR';
    var c8 = 'NZD';
    var c9 = 'SGD';
    var c10 = 'CNY';
    var mcol = 'FFFFFF';
    var mbg = 'FFFFFF';
    var f = 'calibri';
    var fs = '11';
    var fc = '000000';
    var tf = 'calibri';
    var ts = '14';
    var tc = 'FFFFFF';
    </script>
    <script type="text/javascript" src="http://www.currency.me.uk/remote/ER-TABLED2-1.php"></script>
    </div></div>

  • #3
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    So you want those three divs (#footer-widget1, #footer-widget2 and #footer-widget3) to be in the same line (last one is floating below the other two at the moment)?

    Your #footer-widgets div has a width of 800px, and each widget div has a width of 260px, that are already 780px. Then you gave every widget div a margin of left and right from 10px to 30px, therefore you require at least 870px of width, which your #footer-widgets div doesn't provide.

    So you should change the sizes of the widgets or you lower the margin or you give the footer more width (at least the 870px that are required)? Or what are you asking for, I hope I understood your problem right?

  • #4
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,956
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Do you mean the gap below the 'Exchange Rates' heading? This is caused by this html:

    Code:
    <div style="width: 178px; text-align: center; padding: 2px 0px; background: none repeat scroll 0% 0% rgb(255, 255, 255); font-family: calibri; font-size: 11px; color: rgb(255, 255, 255); font-weight: bold; vertical-align: middle;"> <a title="Euro" target="_new" href="http://www.exchangerates.org.uk/Euro-EUR-currency-table.html" style="">Euro</a></div>
    You can't see this at the moment because the text colour is set to white (see blue highlight). Amend this to something other than white to show 'Euro', or if you don't want this heading to show and take up any space just delete the whole lot, if you are able to, or set it to display:none.

    Use Firebug (see sig) for this sort of thing.
    Use the W3C HTML Validator and CSS Validator to check your code and Firebug to see what css is applied to an element
    Read Steve Krug's book Don't Make Me Think - essential reading on web usability
    I don't recommend much, but I do recommend Clook for UK web hosting

  • #5
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,777
    Thanks
    6
    Thanked 1,021 Times in 994 Posts
    The second post was blocked by the overly sensitive spam filter; I approved it. Might be important for the understanding.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •