Solved

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

Posted on 2011-09-20
4
193 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
  • 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: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying 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

Suggested Solutions

Title # Comments Views Activity
align Linkedin sign to the right page 5 55
css icomoons will not display on page 14 33
Using Specialized Fonts in CSS 1 24
Wordpress themes CSS? 6 9
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
This article discusses four methods for overlaying images in a container on a web page
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

831 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