none
Centering web page in Expression Web 4 RRS feed

  • Question

  • This is my first site in web 4 (abcappraisal.com) I have tried soluctions from the web to no avail, to float the site to the middle of the page. Any help would be greatly appreciated.

    Lenny

    PS I know this subject has been addressed several times, I feel I'm so close



    leonard D'Agostino
    Friday, April 15, 2011 2:51 PM

Answers

  • To center a block element, you need to

    1. provide a valid doctype for the document (automatic in EW by default)

    2. assign a width to the element

    3. assign margin:0 auto to the element's CSS selector

    That's it. So, given a container div with id of "wrapper," the CSS is

    #wrapper {
       width:600px;
       margin:0 auto;
    }

    In the markup:

    <div id="wrapper">

       . . . rest of container's content here . . .

    </div>

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    • Marked as answer by hope4 Friday, April 15, 2011 4:17 PM
    • Unmarked as answer by hope4 Friday, April 15, 2011 4:17 PM
    • Marked as answer by hope4 Friday, April 15, 2011 8:02 PM
    Friday, April 15, 2011 3:44 PM
  • It was an error thanks for bringing this to my attenction. And ageen thank you Scott for the information it worked perfectly.

    Lenny


    leonard D'Agostino
    • Marked as answer by hope4 Friday, April 15, 2011 5:23 PM
    Friday, April 15, 2011 5:23 PM

All replies

  • To center a block element, you need to

    1. provide a valid doctype for the document (automatic in EW by default)

    2. assign a width to the element

    3. assign margin:0 auto to the element's CSS selector

    That's it. So, given a container div with id of "wrapper," the CSS is

    #wrapper {
       width:600px;
       margin:0 auto;
    }

    In the markup:

    <div id="wrapper">

       . . . rest of container's content here . . .

    </div>

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    • Marked as answer by hope4 Friday, April 15, 2011 4:17 PM
    • Unmarked as answer by hope4 Friday, April 15, 2011 4:17 PM
    • Marked as answer by hope4 Friday, April 15, 2011 8:02 PM
    Friday, April 15, 2011 3:44 PM
  • Hmm, OK, just curious, but why unmark the answer? That is the way it is done, and does answer your question, with both example source markup and CSS. What's the problem?

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.
    Friday, April 15, 2011 5:17 PM
  • I'm curious.... Why did you unmark Scott's answer? 

    Friday, April 15, 2011 5:17 PM
  • It was an error thanks for bringing this to my attenction. And ageen thank you Scott for the information it worked perfectly.

    Lenny


    leonard D'Agostino
    • Marked as answer by hope4 Friday, April 15, 2011 5:23 PM
    Friday, April 15, 2011 5:23 PM
  • Lenny,

    Do you should not mark your post as your answer - it was not your answer, it was your reply to the answer.  Mark Scott's answer as the answer.

    Friday, April 15, 2011 7:59 PM