Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4

Thread: Alignment

  1. #1
    Junior Member ScurvyDavid's Avatar
    Join Date
    Dec 2006
    Posts
    2
    Member #
    14550
    Hey all,

    well i will give you a little backgroun first, i make graphics and soon starting a photography course, and i wanted at first a flash site, but then i worked out i know nothing about how the action scripts work, then i did not want to do my site in tables cause i have done that in the past and they always go wrong. so i decied to give css&<div> ago. and i think i have it coded ok for now.

    but on FireFox the site is not aligned as it is on frontpage anf IE. so just wondering if anybody can lend me a hand.

    http://www.freewebs.com/scurvydavids...lio/index2.htm

  2.  

  3. #2
    Junior Member AWDSolutions's Avatar
    Join Date
    Dec 2006
    Posts
    4
    Member #
    14549
    I was able to get the alignment in both browsers by using the following:

    Note the style="xxxx" in the <div> tag. I saw that you are using a style sheet further up in the code. You can put the same attributes within there as well if you want to keep the actual <div> tag cleaner.

    <div id="wrapper" style="position:absolute; left:35%; top:1px; width:236px; height:314px; z-index:1">
    <div id="background" style="position:absolute; left:0px; top:41px; width:236px; height:314px; z-index:2">
    <div id="logo" style="position:absolute; left:-324px; top:75px; width:236px; height:314px; z-index:4">
    <img src="http://img286.imageshack.us/img286/5462/index03sk7.gif" alt="ScurvyDavids Portfolio" width="298" height="509"/>
    </div>


    <div id="nav" onMouseOver="this.className='over'" onMouseOut="this.className='out'" style="position:absolute; left:0px; top:315px; width:236px; height:314px; z-index:13">
    <img src="http://img83.imageshack.us/img83/1413/indexslices05zm1.gif" alt="arrow" width="38" height="30"/><a href="index.htm"><img src="http://img227.imageshack.us/img227/4469/indexslices06df2.gif" alt="Home Page" border="0" width="142" height="30"/></a>
    <br/>

    <img src="http://img244.imageshack.us/img244/8292/indexslices08cm3.gif" alt="arrow" width="38" height="29"/><a href="index.htm"><img src="http://img244.imageshack.us/img244/5606/indexslices09lg0.gif" alt="Fresh Works" border="0" width="142" height="29"/></a>
    <br/>
    <img src="http://img241.imageshack.us/img241/3342/indexslices10ui1.gif" alt="arrow" width="38" height="30"/><a href="index.htm"><img src="http://img241.imageshack.us/img241/8238/indexslices11ra2.gif" alt="About Me" border="0" width="142" height="29"/></a>
    <br/>
    <img src="http://img291.imageshack.us/img291/8269/indexslices13ls1.gif" alt="arrow" width="38" height="30"/><a href="index.htm"><img src="http://img291.imageshack.us/img291/2531/indexslices12mp6.gif" alt="Gallery" border="0" width="142" height="31"/></a>
    <br/>
    <img src="http://img157.imageshack.us/img157/6571/indexslices14je8.gif" alt="arrow" width="38" height="24"/><a href="index.htm"><img src="http://img242.imageshack.us/img242/4038/indexslices15iw3.gif" alt="Contact" border="0" width="142" height="24"/></a>
    </div>

    </div>


    <div align="left"></div>
    </div>

  4. #3
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,755
    Member #
    5580
    Liked
    720 times
    David ...

    My solution was a bit different.

    Several changes, including your <doc type> and header ...

    Here's my example:

    http://www.catpin.com/test.html


    View the HTML source code.

    You will actually want to use a separate CSS style sheet file (something.css) ...
    That way, all of your pages can use the same style sheet.

    The whole key to making this work is by nesting <div>'s.


  5. #4
    Junior Member ScurvyDavid's Avatar
    Join Date
    Dec 2006
    Posts
    2
    Member #
    14550
    Quote Originally Posted by mlseim
    David ...

    My solution was a bit different.

    Several changes, including your <doc type> and header ...

    Here's my example:

    http://www.catpin.com/test.html


    View the HTML source code.

    You will actually want to use a separate CSS style sheet file (something.css) ...
    That way, all of your pages can use the same style sheet.

    The whole key to making this work is by nesting <div>'s.
    thanks for that bit of coding, that will be a great help for me on the pages i am going to be cutting content. but this first page, i just wanted to have the box in the middle all centered just for this one index page, with no actul text/picture content. then on the other pages i wanted the box aboe to go to the right, and now with the help you have provedied that should be no trouble.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 04:54 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com