Need help with website!

ISolveCubes · Sep 7, 2015

Hello! I have started my website from nearly nothing so I could make it the way I wanted it. I also have some questions about it. First, I have ran into a problem and I am not sure how to fix it. Unfortunately, I do not know how to position things where I wanted it, and the second thing is I do not know how to add scrolling to my website. I have gone to websites and looked for CSS codes and pasted them and tested it, but I simply could not get it to scroll down. You may check it for yourself in developer mode on google chrome. Check the HTML and CSS for yourself and edit it. If you have any solutions, please comment! Thanks!

This is my website link Learn the cube!

carnageX · Sep 7, 2015

Scrolling will only occur if the content on the page exceed the resolution on the user's monitor.

ISolveCubes · Sep 7, 2015

carnageX said:
Scrolling will only occur if the content on the page exceed the resolution on the user's monitor.

I do not seem to understand that answer very easily. My website has a heading under the video saying TEST FOR SCROLLING. and I cannot scroll down to see it. This is what I placed under the video specifically: <h1>TEST FOR SCROLLING</h1>

Check the coding in Google Chorme if you would like to see what I am talking about. Check out what I placed in the CSS sheet too.

carnageX · Sep 7, 2015

I see what you mean now. I had to resize the window so it was smaller so everything wouldn't fit on my screen.

Your problem is in your CSS class for the body tag. You have "position: fixed;" which gives it a fixed position, thus making the entire body (and it's children) non-scrollable.

ISolveCubes · Sep 7, 2015

carnageX said:
I see what you mean now. I had to resize the window so it was smaller so everything wouldn't fit on my screen.

Your problem is in your CSS class for the body tag. You have "position: fixed;" which gives it a fixed position, thus making the entire body (and it's children) non-scrollable.

Okay, so how would I fix that so It would not mess with the background picture, but also be able to scroll up and down?

carnageX · Sep 7, 2015

Removing the "position: fixed;" property (looks like Line 3 of your CSS file), the background isn't affected, at least in Chrome. The "background-attachment: fixed;" property does what you're thinking of; but you have that in the shorthanded "background" property already. So just remove Line 3 and it will scroll.

ISolveCubes · Sep 7, 2015

Wow! thanks a lot! It fixed it!

So would you have any tips on how to position things in the page?

carnageX · Sep 7, 2015

Nest your content inside of a new div in the body tag, with a class or ID of "content", and then create individual divs / sections (new in HTML5 I believe) so that content is separate.

E.g.

Code:

<body>
    <div class="content">
        <div class="section1">Nested content here...</div>
        <div class="section2">More nested content...</div>
        ...etc.
    </div>
</body>

Then apply the appropriate styles to the content / additional classes.

ISolveCubes · Sep 7, 2015

Okay! Thanks for all of the help!

Believe it or not that actually helped a LOT!

carnageX · Sep 7, 2015

No problem, glad to help.

Need help with website!

ISolveCubes

Baseband Member

carnageX

Private Joker,

ISolveCubes

Baseband Member

carnageX

Private Joker,

ISolveCubes

Baseband Member

carnageX

Private Joker,

ISolveCubes

Baseband Member

carnageX

Private Joker,

ISolveCubes

Baseband Member

carnageX

Private Joker,

Similar threads