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.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 11
  1. #1
    Junior Member
    Join Date
    Nov 2012
    Posts
    9
    Member #
    33943
    Liked
    1 times
    I'm currently having an issue with the layout of my site. I've actually have all of the images for layout into place, but what's giving me an issue is all the text and navigation menu doesn't move with the images when changing the size of the browser window..so you'll drag the window to a larger size, and while the images and margins all conform to that, the text stays in one spot no matter what. This may be due to that I placed the text over a certain amount of pixels to lay on top of the image for that size that I have it set on within my editor. If that's the case, I don't know an effective way to place the text on top of the image and have it scale in location accordingly as the browser page is either made larger or smaller. Here is the snippet of code in my style sheet for placing the text within my image:

    #image_1 {
    position: relative;
    }

    #inside_image {
    position: absolute;
    top: 50px;
    left: 120px;
    }

    I'm not sure what to do about it. It is literally the last thing on the site that is holding me back from completion. If anyone can help me that would be awesome I'd greatly appreciate it. I'm a beginning developer, so while this might be an easy solution, I apologize.

  2.  

  3. #2
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,485
    Member #
    425
    Liked
    2783 times
    On the surface, assuming inside_image is inside of image_1, that should work. That probably means something else is going on.

    What's the URL of the page you're referring to?
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)

  4. #3
    Junior Member
    Join Date
    Nov 2012
    Posts
    9
    Member #
    33943
    Liked
    1 times
    I haven't put it up on the web yet, but I can give you the files if you wanna take a look. it puts it right inside..but the minute i change the size of the page..the text doesn't move with the image as the image moves over to fit the margins i have set.

  5. #4
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,485
    Member #
    425
    Liked
    2783 times
    Hmmm...generally people will prefer to have it put somewhere that they can have a look at. Even if it's not working, upload it somewhere.
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)

  6. #5
    Junior Member
    Join Date
    Nov 2012
    Posts
    9
    Member #
    33943
    Liked
    1 times
    I just purchased a domain name and hosting services from 1and1 for testing purposing so I'll have to put up the link as soon as i get the email so that I can set up my domain name and add my files.

  7. #6
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,485
    Member #
    425
    Liked
    2783 times
    Sounds good. They shouldn't take too long. But you generally don't want to buy your domain from your host, especially when the provider is 1and1. They'll do for testing purposes, but in the long run, you'll want to upgrade on both fronts from those guys.
    AlphaMare likes this.
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)

  8. #7
    Junior Member
    Join Date
    Nov 2012
    Posts
    9
    Member #
    33943
    Liked
    1 times
    http://studioarctesting.com/
    Here is the link for the site. As you can see, depending on whether you have the browser page maximized, or at a different size that you have dragged it over to, the text stays in one place and does not scale with the margins I have set, that the images easily follow. The navigation links don't go anywhere yet, until I fix this text issue.

  9. #8
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,485
    Member #
    425
    Liked
    2783 times
    Okay, I see why you're having the issue.

    You're trying to position text inside of an image...since an image tag is a singleton tag (there's no content that goes inside of it), you can't absolutely position anything inside of it. That's the bad news.

    The good news is that there is something you can position your text inside of, and that's the list item containing both of the images. Both your image and your p tag are inside of a list item...so change your code so that your list item id is "justin_johnson" and you'll get exactly what you want.
    Psyxx likes this.
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)

  10. #9
    Junior Member
    Join Date
    Nov 2012
    Posts
    9
    Member #
    33943
    Liked
    1 times
    Quote Originally Posted by TheGAME1264, post: 244455
    Okay, I see why you're having the issue.

    You're trying to position text inside of an image...since an image tag is a singleton tag (there's no content that goes inside of it), you can't absolutely position anything inside of it. That's the bad news.

    The good news is that there is something you can position your text inside of, and that's the list item containing both of the images. Both your image and your p tag are inside of a list item...so change your code so that your list item id is "justin_johnson" and you'll get exactly what you want.
    Thank you very, very much. I'll add that to all the spots where I was looking for the same effect.

  11. #10
    Unpaid WDF Intern TheGAME1264's Avatar
    Join Date
    Dec 2002
    Location
    Not from USA
    Posts
    14,485
    Member #
    425
    Liked
    2783 times
    Actually...if you're going to do that, make sure you convert the ids to classes. id is only meant for one specific element. Classes are meant for a group of them.

    And no problem, dude. Justin looks like an interesting guy. Kind of angry, but a chip on the shoulder's not necessarily a bad thing.
    If I've helped you out in any way, please pay it forward. My wife and I are walking for Autism Speaks. Please donate, and thanks.

    If someone helped you out, be sure to "Like" their post and/or help them in kind. The "Like" link is on the bottom right of each post, beside the "Share" link.

    My stuff (well, some of it): My bowling alley site | Canadian Postal Code Info (beta)


Page 1 of 2 1 2 LastLast

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:23 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com