Sign in to follow this  
Followers 0

CSS Centered Navigation and Content

3 posts in this topic

I'm making a theme for tumblr, or at least attempting to. I have never done html/css before. Just started this last night.

So I was trying to figure out how to make the content center horizontally and vertically while having a floating navigation panel and allow content to scroll.

I looked everywhere for an example to look at the code to figure out how to do exactly what I wanted, but couldn't find one.

The ones I found used iframes or anchored the navigation to the right, left, top and right of the web browser.

But I did it. Figured it out.

Here's what I came up with. It's not much, just an example of the content floating centered horizantally and vertically.


Can some experienced Web Designer take a look at the code and see if there's anything wrong with it and show me a better way to do it if there is one. Also if you know of any website that actually does this. I'd like to take a look at it.

Share this post

Link to post
Share on other sites

Hi duhk, i had a quick scan of the code and only being a novice myself cannot give awesome feedback and say this is wrong here and there and this should be like this with example code but i can point you in the direction of something called containers and wrappers (depends which you prefer to call yours). Here is a quick tutorial.

Share this post

Link to post
Share on other sites

Thanks, but I figured my original idea of how my design was gonna work is too complex with too many divs. It's my first web design and I'm learning everything as I go. So, I think I'll start simple first before doing anything too complex.

This is what I got so far. The first image is the main tumblr page. The left pane scrolls through the posts which are nested next to each other with no gap between them. The scrollbar is hidden under the right div, just until I can find a good skinny scrollbar script.


The second image is what you see when you click on a post.


Those colors are are just what I added so I could see the divs while I was working on their positions. I'm still thinking about how I will arrange the navigation, links and other content in the right pane.

What do you think?

Also, I just realized designing a web page is like Inception.

Edited by duhk

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  
Followers 0

  • Recently Browsing   0 members

    No registered users viewing this page.