Need help with website!

ISolveCubes

Baseband Member
Messages
30
Location
Hyrule
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!
 

ISolveCubes

Baseband Member
Messages
30
Location
Hyrule
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.
 
Last edited:

carnageX

Private Joker,
Staff member
Messages
25,043
Location
South Dakota
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

Baseband Member
Messages
30
Location
Hyrule
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

Private Joker,
Staff member
Messages
25,043
Location
South Dakota
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.
 

carnageX

Private Joker,
Staff member
Messages
25,043
Location
South Dakota
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.
 
Top