Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] getting padding-right for no reason?

  • This topic is empty.
Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #191707
    alialnoaman
    Participant

    I am getting padding right on my website for no reason.

    this is my website: vzide.com/answers

    you will notice a scroll-bar and a huge empty space at the right side.

    how to get rid of it?

    #191710
    Paulie_D
    Member

    To start with your HTML is weird.

    You have a lot of stuff inside the body that should be in the head.

    As such your markup is invalid and even the W3C validator threw it out.

    Everything seems to be laid our with either position:absolute or position:relative and the latter have some odd values.

    There are much better ways of laying out a site
    . Check this link – http://learnlayout.com/

    #191725
    Senff
    Participant

    I am getting padding right on my website for no reason

    There’s always a reason. In this case, it’s the left:40%: on the div with class s_p.

    #191735
    alialnoaman
    Participant

    actually I have all the head tags inside the head but it shows it inside the body for no reason :/

    #191736
    alialnoaman
    Participant

    I dont think so, left:40% of the body which mean it should not create any extra padding out of the body

    #191743
    Senff
    Participant

    actually I have all the head tags inside the head but it shows it inside the body for no reason :/

    Again, “no reason“? No, there is a reason, and that’s because you placed HTML code between the HEAD and BODY tag:

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    </head>
    <header class='nav'><a href='/answers' style='text-decoration: none;color:white;padding-left: 15px;
    font-size: 20;'>BlodExchange</a></header>
    
    <body style="background-color:#EEEEEE;">
    

    I dont think so, left:40% of the body which mean it should not create any extra padding out of the body

    No, it means that your block will be repositioned and placed 40% left of the body, while keeping the same 100% width, hence taking up space outside of the body on the right.

    Also, I second @Paulie_D’s advice above.

    #191760
    alialnoaman
    Participant

    I deleted all the codes between </head> and <body> but still showing the head tags inside the body :/

    and I couldnt get rid of the extra space at the right of the website :(

    any solutions?

    Thanks for helping :)

    #191806
    Senff
    Participant

    I deleted all the codes between </head> and <body> but still showing the head tags inside the body :/

    You have some invalid, non-standard invisible characters in your HEAD tag, right after <head>. Remove this part and type it in again, making sure you’re not adding any strange characters anywhere:

    <head>
    <meta charset='utf-8' />
    

    and I couldnt get rid of the extra space at the right of the website :(

    any solutions?

    The same one I mentioned two times before. Did you try removing the left: 40%; from .s_p to see if that would do something?

    #191829
    alialnoaman
    Participant

    Senff: When I remove left: 40%; the search text input moves to the left side . I want it to be in the middle :/

    kwerty: actually this works but the form doesnt stay at the place I want it to be.

    Shikkediel: Thanks for mentioning :)

    #191831
    Paulie_D
    Member

    There are much better ways of laying out a site…

    …than the option you have chosen

    I strongly suggest you review the link I offered and start over.

    #191834
    Senff
    Participant

    Senff: When I remove left: 40%; the search text input moves to the left side . I want it to be in the middle :/

    Then you weren’t clear about what you wanted. To do that, you’ll need to add more code, like:

    .s_p form {
       text-align:center;
    }
    

    However, by doing that, you’ll be adding code that may fix one problem, but it could break other things. There are a lot of issues with your code. Instead of patching every problem, I fully back up @Paulie_D’s advice and suggest you start over properly.

    Don’t take this as harsh criticsm; we’re here to help. And the best way to help you with this is to tell you that you’re not using the proper methods, and that you should look into how things should be done properly.

    #191836
    alialnoaman
    Participant

    I fixed it by making it inside a div with 47% width and align center then I added a padding-left for the form and I increased the form inputs width. Its perfect now.

    Thanks for helping :)

    #191840
    GSutherland
    Participant

    I’m not sure there is such a thing as perfect code…

    #191842
    alialnoaman
    Participant

    GSutherland: There is for sure :)

Viewing 14 posts - 1 through 14 (of 14 total)
  • The forum ‘CSS’ is closed to new topics and replies.