Solved

How do we center the contents for the following css file? thanks

Posted on 2011-09-20
4
203 Views
Last Modified: 2012-06-27
#container
{
    width: 98%;
    margin: 10px auto;
    background-color: white;
    color: #333;
   
}


#top
{
    height: 100px;
    width: 98%;
}



#topleft
{
    float: left;
    width: 20%;
}


#topcenter
{
    float: left;
    width: 55%;
}
#topright
{
    border-color: #FFFFFF;
    border-width: 5px;
    float: right;
    width: 23%;
    background-color: #800000;
    font-family: 'Times New Roman' , Times, serif;
    font-size: medium;
    color: #FFFFFF;
}
0
Comment
Question by:goodk
[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 29

Accepted Solution

by:
QPR earned 250 total points
ID: 36571427
0
 
LVL 15

Assisted Solution

by:Jagadishwor Dulal
Jagadishwor Dulal earned 250 total points
ID: 36571450
you may have problem that you did not see the page in center that is because you have used 98% width. Your css is ok just make some fixed width for container div and for top bottom use percentage like below:

#container
{
    width: 980px;
    margin: 25% auto;
    background-color: white;
    color: #333;
   
}

Open in new window

0
 

Author Comment

by:goodk
ID: 36587429
It does not work; I was asking how the entire #topcenter div would appear in the center; not the contents.  

All I want is one container with three sections inside and all sections centered.  I know I can move the sections by putting margin-left, but this is not a proportionate solution.

If the user makes the page smaller then these sections start to move under the other.  Which is not desirable.

Anyway I am confuse.. please help!


0
 

Author Closing Comment

by:goodk
ID: 37058116
thanks for trying..
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

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

This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …

732 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