Activity Stream
48,167 MEMBERS
6715 ONLINE
besthostingforums On YouTube Subscribe to our Newsletter besthostingforums On Twitter besthostingforums On Facebook besthostingforums On facebook groups

Results 1 to 6 of 6
  1.     
    #1
    Member

    Default CSS Div Width Help Please

    Hello, I have a small problem with my website I hope someone can help.

    I created a a fixed div that streches full screen: no problem with that

    Code: 
    #topdiv {
          background-image:url(../images/nav-bg.png);
          position:fixed;
          top:0px;
          left:0px;
          width:100%;
          height:75px;
          z-index:1;
    
    }
    Right under that i created another div that i want to strech full width:

    Code: 
    #services{
        background-image: url(../images/services-bg.png);
        background-repeat: repeat-x;
        position: absolute;
        top: 0px;
        left: 0px;
        right: 0px;
        width: 100%;
        height: 314px;
    
    }
    Now the problem is, when i view it in my browser at full size, it does stretches full width, however when i add content to this div and then resize my browser, i get a horizontal scroll bar and when i scroll right, the div won't strech at full width.

    Im adding an image so you can see it more clearly.


    my html code is just:

    <!DOCTYPE html>
    Code: 
    <html>
        <head>
        <meta charset="utf-8">
        </head>
    <body>
    
    <div id="topdiv">
        <div id="logo"><img src="images/logo.png"></div>
        <div id="navmenu"><?php include("nav_menu.php"); ?></div>
    </div>
    
        <div id="services"><img src="images/services_hdr.png">
        
        </div>
    </body>
    </html>
    I'd appreciate any help. Thanks a lot
    Napis Reviewed by Napis on . CSS Div Width Help Please Hello, I have a small problem with my website I hope someone can help. I created a a fixed div that streches full screen: no problem with that #topdiv { background-image:url(../images/nav-bg.png); position:fixed; top:0px; left:0px; width:100%; Rating: 5

  2.   Sponsored Links

  3.     
    #2
    Member
    Website's:
    sborg.us
    Is this site live? If yes, then please share (or PM) the link as it will be easier.

    V3g3ta | Halcyon | Abhi

  4.     
    #3
    Member
    no it's not live yet, i'll upload it and post the link. Thanks

  5.     
    #4
    Member
    Hmm... that's weird. The only thing I found wrong it that you're not using the slash at the end of the <img> tags and it's alt attribute as you should - as <img src="X.png" alt="" />.

    Have you tried setting the #services width @ min-width:100% ?

  6.     
    #5
    Member



    Thanks, I uploaded the website so it will be easier to see the problem.


    http://napis.byethost7.com/


    I've tried relative and absolute postition and margins paddings 0
    top-margins, min-widths, etc and nothing seems to work.


    I just dont understand how the topdiv works and reaches 100% width
    even when i add content on that div and resize the browser window
    but the services div will shrink


    The only way i can make it stretch 100% width when i reduce the
    browser window and with content in it, is that if i set the width to 1280px width
    but i dont think that'd be proper? i know it should work with just width:100%


    Thanks everyone for the help.

  7.     
    #6
    Member
    Website's:
    sborg.us
    I removed (via Firebug) all the min-width: 1225px; from the styles and it seems to be working fine on my machine. (1024x764px display)

    This is my edited CSS file: http://pastebin.com/mDCGkfn3

    Did you try it out on Firefox/IE?

    V3g3ta | Halcyon | Abhi

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. how to fix wordpress width
    By -={MINDFREAK}=- in forum Web Development Area
    Replies: 4
    Last Post: 1st May 2011, 04:24 PM
  2. memberBox width
    By Mac in forum Feedback and Suggestions
    Replies: 4
    Last Post: 21st Dec 2010, 10:56 AM
  3. How to increase width?
    By umang in forum Web Application/Script Support
    Replies: 1
    Last Post: 5th Nov 2010, 12:48 AM
  4. Change width, ipb 3.0.x?
    By c0rrup in forum IP.Board
    Replies: 8
    Last Post: 2nd Sep 2009, 07:42 PM
  5. Help fix my forum width
    By DINDI in forum IP.Board
    Replies: 4
    Last Post: 2nd Sep 2009, 07:38 PM

Tags for this Thread

BE SOCIAL