1. Welcome to TechPowerUp Forums, Guest! Please check out our forum guidelines for info related to our community.

Help with simple issue on website

Discussion in 'Programming & Webmastering' started by Morrison5891, Apr 26, 2013.

  1. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    Hey guys!!

    So, i'm having this issue. I have designed our companies website and its been live for a while now. I wanna make a simple change, but for the life of me can't figure this out. Our website is http://www.mycompumore.com and if you look at the green image with the word "technology" in it... to me its out of place. I wanna place that image so it is at the left so it start at the white border... Anyone have a simple fix for me to accomplish this? It's driving me crazy.

    Any help would be appreciated.

    Thanks,
    -Dave
  2. Asylum

    Asylum

    Joined:
    Jul 18, 2008
    Messages:
    2,796 (1.25/day)
    Thanks Received:
    674
    Location:
    South Carolina
    I think it looks proper as it is.

    If you change it will offset the rest of the site.
  3. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    Part of the reason I want that image all the way to the left is so I can make the video width a little longer.
  4. Asylum

    Asylum

    Joined:
    Jul 18, 2008
    Messages:
    2,796 (1.25/day)
    Thanks Received:
    674
    Location:
    South Carolina
    Just shorten your image and increase the video box.
  5. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    I've tried that and it offsets the video and the rest of the set. Its a werid issue and its driving me insane!
  6. syeef

    Joined:
    Jul 5, 2008
    Messages:
    287 (0.13/day)
    Thanks Received:
    68
    In your CSS (layout.css), try removing the bold codes:

    #widgets {
    width: 980px;
    margin: 0 auto;
    }

    #widgets #miniBanner {
    float: left;
    margin-right: 25px;
    margin-top: 0px;
    padding-left: 10px;
    }
  7. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    That kinda worked. It did send the image to the left where I wanted it... but it offsets the little box below the video where it says "More Customer Testimonials"

    Thanks
  8. syeef

    Joined:
    Jul 5, 2008
    Messages:
    287 (0.13/day)
    Thanks Received:
    68

    For that you have to change this:

    #widgets #miniBanner {
    float: left;
    margin-right: 35px;
    margin-top: 0px;
    }

    You have to change 25px to 35px.
  9. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    Great!! thanks alot! So how would I make the video width a little longer? I've tried adjusting it but it off sets the rest of the page!

    thanks
  10. syeef

    Joined:
    Jul 5, 2008
    Messages:
    287 (0.13/day)
    Thanks Received:
    68
    The value you set for width is wrong... try increasing it or you could remove it totally.

    #widgets {
    width: 980px;
    }
  11. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    Appreciate all the help... but doing that it offsets the video and the box below it!!
  12. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    If you look at the video... there is a lot of white space to the right of the video... I wanna increase the width of the video to to fit in that white space... but not all the way. if that makes any sense.
  13. syeef

    Joined:
    Jul 5, 2008
    Messages:
    287 (0.13/day)
    Thanks Received:
    68
    I know, that it offsets the video and the box below it.

    I was asking you to fix only the main wrong things and was hoping you would figure out the rest on your own.

    If you remove the width totally, there won't be any "white space" to the right of the video.

    #widgets {
    width: 980px;
    }

    Then try adjusting other content's width, margin, padding values so that it is no longer out of place.
    Morrison5891 says thanks.
  14. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    Great, everything worked out great! Thank you so much. I'm sure you can tell i'm an amateur when it comes to web design by looking at my code. Again, thank you for the help!
  15. syeef

    Joined:
    Jul 5, 2008
    Messages:
    287 (0.13/day)
    Thanks Received:
    68
    No problem... Anytime! :)
  16. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    Appreciate it ... my next project is to add a few more spaces between the "bubbles" ... I design this site but its been a while. I tough myself html, css, and php when designing this site. I've been trying to add spaces in between them for a while and i'm just lost!
  17. syeef

    Joined:
    Jul 5, 2008
    Messages:
    287 (0.13/day)
    Thanks Received:
    68
    Again the problem is the width you set. From the looks of it, your default width is 1050px, so change the bold values in your CSS:

    Code:
    #bubbles {
    [INDENT]clear: both;
    [B]width: 1050px;[/B]
    margin: 0 auto;
    position: relative;
    top: 10px;[/INDENT]
    }
    
    #bubbles #bubble {
    [INDENT]float: left;
    width: 262px;
    height: 240px;
    [B]margin-left: 36px;[/B]
    background-repeat: no-repeat;
    padding: 20px;[/INDENT]
    }
    Also, you are not supposed to put the same id for multiple contents, I am talking about the id "bubble".

    You could code like this:

    Code:
    <div id="bubbleBlue" class="bubble">...</div>
    <div id="bubbleRed" class="bubble">...</div>
    <div id="bubbleGreen" class="bubble">...</div>
    Morrison5891 says thanks.
  18. Morrison5891

    Morrison5891 New Member

    Joined:
    Mar 13, 2009
    Messages:
    806 (0.40/day)
    Thanks Received:
    91
    Location:
    Bannock County
    worked perfectly, thanks again buddy! You have been a huge help!

Currently Active Users Viewing This Thread: 1 (0 members and 1 guest)

Share This Page