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 7 of 7
  1. #1
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts

    Exclamation I want to reduce the overall height of the page. NOW SORTED.

    I want to reduce the overall height of the following page.
    Move the menu up and bring the footer and w3 validator sigms up a bit, but still allow some space to add to the menu if necessary. I have altered things around but only made matters worse.
    Any help gratefully received.

    Frank

    http://www.exitfegs.co.uk/Sources.html
    Last edited by effpeetee; 09-12-2007 at 03:31 PM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #2
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    Change #links to:

    Code:
     
    #links {
            clear: left;
            font: 12px Georgia, "Times New Roman", Times, serif;
            margin-top: 10px;
    }
    and then I would look at giving your Valid buttons a float value so that they sit side-by-side, saving you an extra 32 pixels or so?
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • #3
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    I would look at giving your Valid buttons a float value so that they sit side-by-side
    Yes! Well! I have floated every thing every way that I can think of, but the result still s(t)inks.
    I modified the #links as suggested.

    I did css #valid1 and #valid2 and wrapped a div around the valid html. I managed to get the 2nd valid sign to the right, but still too low.

    Throw me a lifebelt someone.

    Frank
    Last edited by effpeetee; 09-12-2007 at 02:12 PM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #4
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    Wrap both buttons in a div, give it a width of 136 pixels and use margin auto to center them, then for each image you need to have it floated left
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • Users who have thanked ahallicks for this post:

    effpeetee (09-12-2007)

  • #5
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Quote Originally Posted by ahallicks View Post
    Wrap both buttons in a div, give it a width of 136 pixels and use margin auto to center them, then for each image you need to have it floated left
    Thanks again for lifebelt! It is exactly what I needed. You are a very fine teacher.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #6
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    Not quite what I meant Frank

    You need to create a div called #valids for example, and wrap both valid button ins this div. Then give each valid image a class and use the float; left; on this, like the following:

    Code:
    <div id="valids">
    	<a href="http://validator.w3.org/check?uri=referer">
    		<img style="border:0; width:88px; height:31px; float:left;" src="xhtml.png" alt="Valid XHTML 1.0 Strict" />
    	</a>
    	<a href="http://jigsaw.w3.org/css-validator/">
    		<img style="border:0; width:88px; height:31px; float:left;" src="vcss.png" alt="Valid CSS!" />
    	</a>
    </div>
    And the CSS:

    Code:
    #valids {
    	margin: auto;
    	width: 176px;
    }
    Last edited by ahallicks; 09-12-2007 at 03:39 PM.
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • #7
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Even better!

    Now done on site. Thanks.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.


  •  

    Posting Permissions

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