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 3 of 3
  1. #1
    Regular Coder
    Join Date
    Nov 2005
    Posts
    750
    Thanks
    138
    Thanked 1 Time in 1 Post

    Position of form and padding attribute

    Hello

    I have the same form on two Web pages (same site). I am trying to 'pull up' the form to position it closer to the top of one page here

    http://www.bayingwolf.com/India/contact.html using 'padding-top:90px' and that's fine. The CSS looks like this:

    Code:
    form {
     margin: 0;	
    padding: 0;
    padding-top:90px
    }
    However, this CSS misplaces the form on my other Web page here: http://www.bayingwolf.com/India/review.html The form is far too low on the page.

    If I change the 'padding' in my CSS to '0px' it is fine, but then the form on my 'contact.html' page is misplaced. I have tried to use different classes in my CSS, for example,

    Code:
    form {
     margin: 0;	
    padding: 0;
    padding-top:90px
    }
    for my 'contact.html' page and

    Code:
    formReview {
     margin: 0;	
    padding: 0;
    padding-top:0px
    }
    in my 'review.html page', but it doesn't achieve what I am aiming for.

    Many thanks.

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello SteveH,
    You can be more specific as to which page's form gets padding and which doesn't by giving the body of one of them an id. Try this once -
    Code:
    body#contact form {padding: 90px 0 0;}
    
    form {
     margin: 0;	
    padding: 0;
    }
    Code:
    <body id="contact">		
    
    <div id="outer">
    			
    <div id="header">
    				
    <div id="logo">
    	
    
    
    
    <img src="images/title1.png" alt="Name" height="73" width="336">
    			
    
    
    
    
    </div>
    				
    
    <div id="nav">
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    SteveH (01-19-2014)

  • #3
    Regular Coder
    Join Date
    Nov 2005
    Posts
    750
    Thanks
    138
    Thanked 1 Time in 1 Post
    Hello Excavator

    After a bit of messing about - quite a bit of this CSS seems superfluous - the px dimensions seem just fine now!

    When I tried something similar earlier, I just couldn't get it to work.

    You're a gem!

    Thank you.

    Steve


  •  

    Posting Permissions

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