Solved

CSS issues with page containers

Posted on 2013-05-20
4
356 Views
Last Modified: 2013-05-20
I am trying to create a standard web page that contains a top half (containing a background image - height: 105px) that stretches the full width of the page (width: 100%).  Inserted on the top half section is an image (980 x 105) that is centered.  What I am trying to do is insert a container underneath the top half with a width of 980px that is centered, thus allowing me to add other DIVs inside the container.  But I cannot figure out how to do this. Is this correct?

Top portion of page stretches full length of web browser.  The middle and bottom portion will be centered. Inside the centered portion (container) of the page will contain DIVs with different widths.

Attached is my code for review and any help is greatly appreciated.  Thank you.

Page:
default.htm


CSS:
master.css
0
Comment
Question by:arendt73
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 9

Expert Comment

by:user_n
ID: 39182167
0
 

Author Comment

by:arendt73
ID: 39182232
What I need help with is setting up the container column down the middle of the page, underneath the top half of the page.  The image appears without issue, unless it is recommended that I change the way it appears.

Inside the center column will contain three columns, from right to left, the widths are: 180, 15, and 785. The position for each of the three columns totaling 980 should be top.
0
 
LVL 6

Expert Comment

by:lightspeedvt
ID: 39182248
You are going in correct way. Just place "content" and rest divs that you need inside "table". Here is an example:
http://jsfiddle.net/m7WBw/
0
 
LVL 6

Accepted Solution

by:
lightspeedvt earned 500 total points
ID: 39182278
Just saw your comment, so here is updated demo:
http://jsfiddle.net/m7WBw/1/
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Anyone familiar with PhotoSwipe? 3 42
CSS (jquiry mobile) question 3 34
PDF Turn Look 7 37
CSS - display the same fonts throughout website. 4 29
Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question