0

Hello,

I am trying to write css code that would fill the whole code of width.

http://www.innovation.web.id/

Do know how to make my navigation bar and footer bar fill the whole width of the web browser? or adjust to any web browser size without horizontal scroll?

Thanks in advance.

2
Contributors
3
Replies
25
Views
1 Year
Discussion Span
Last Post by gentlemedia
0

For starter, don't use fixed px widths on your #container (1024px) and your #navigation (1050px).
Block-level elements such as a div will fill by default (auto) the full width of the window or it's containing element if you don't set a width in your CSS.

By the way... you're still on bloody slow server. It took ages to load everything.

0

I work it offline meanwhile.

I appologize my online webpage - uses Indonesian webserver (which I prefer compare to USA web server, since most of my clients lives in Indonesian). It only moves fast in Indonesia and slower in International - I could only pick one choice not both) - please tolerate this thanks.

Anyway, I don't think it makes lots of difference though. I already fix the footer and not the navigation bar. Any idea - how to make the navigation bar full width?

I already try changing the width to auto or delete it and still the navigation bar does not change or show up.

Please help. Thanks.

1

You're making it for yourself already complicated with a HTML structure like this for your navigation bar.

<div id="coffee"><img src="images/coffee.jpg" width="130" height="120"></div>


<!-- navigation -->
<div id="logo"><img src="images/logo.png" alt="logo" width="200"></div>

<div id="navigation"></div> 

<div id="navcontainerbar">
<ul>

<li><a href="index.php">HOME</a></li>
    <li>

    <ul id="nav">
        <li><a class="fly" href="#">PORTFOLIO</a>
            <ul class="dd">
                <li><a href="portfolio.php">Web Porfolio</a></li>
                <li><a href="marketing-portfolio.php">Marketing Portfolio</a></li>             
            </ul>
        </li>     
    </ul>

    </li>    
<li class="service"><a href="services.php">SERVICES</a></li>
<li><a href="blog.php">BLOG</a></li>
<li><a href="contact.php">CONTACT</a></li>

</ul>
</div>

Visually, thus on the screen, it looks like these div tags are nested in a wrapper div, but they're not. All you did was position them ontop of each other with CSS fixed positioning and odd margins. And still all this hard coded <br> tags used for spacing.

Davy, before you want to sell services such as web design/development to clients, you really need to take a huge amount of steps back and start with the basics and that is learning HTML & CSS the proper way.
So before this thread ends up again in a thread with 40+ posts, I strongly advice you to start at the begining. Learn to walk before you can run!

http://learn.shayhowe.com/html-css/

Edited by gentlemedia

Votes + Comments
If only... :) Water and horse spring to mind
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.