PDA

Click to See Complete Forum and Search --> : divs to place where I placed them in dreamweaver??

gangsterpb
11-17-2009, 06:36 PM
So me and my daughter have been working on this website and have gotten it to be centered with different browser windows and resolutions. Web designing is very new to me so I don't understand a lot of it. Anyway, I am trying to get the nav bar to move in bigger monitor sizes. In my daughter's monitor(smaller), the navbar shifts to the right a bit. And in my computer(larger) the nav bar shift a lot to the right. How do I get the nav bar to be in the position I placed it in dreamweaver??

The site we are working on: www.gangsterpb.com/index2

And if you want to see the old site (not centered and bigger): www.gangsterpb.com
chaz2290
11-17-2009, 07:16 PM
Here is what you need to do:

First of all paste this code in to the <HEAD> section of your document:
<style type="text/css">
.navCentered
{
text-align:center;
margin-top:0px;
margin-bottom:0px;
padding:0px;
}
</style>

Then click the image you wish to centre and go to insert > Layers > Div

Now the second drop down the second drop down menu and you should be able to select navCentered

Click OK.

Done.

By the way I wrote this without having dreamweaver open so sorry it isn't perfect. I think the second form says ID.

This will also be in the middle no matter what the resolution, known as being fluid by the way.

Hope this helps:)
gangsterpb
11-17-2009, 07:33 PM
Well I'm not trying to center the main content just place the nav bar on the left to move with the content that already centers automatically..
chaz2290
11-17-2009, 08:43 PM
The link doesn't work, can you fix it so I can see what the problem is?
I don't understand.
gangsterpb
11-18-2009, 05:53 PM
I'm not worried about what it links to right now. Its that the div is supposed to be right under the word menu in different browser windows, because in my daughter's screen, which is way smaller than mine, the div appears to be a little to the right and on my screen its WAY off to the left.
chaz2290
11-18-2009, 07:07 PM
To be honest...haven't a clue. Hopefully someone else on here can help!
opifex
11-18-2009, 08:41 PM
Probably your best alternative for this is to use a 2 column css layout. Cut up the image GGPageSmall.gif into the individual components (left_top, left, center_banner, center_nav, center_content, right, right_bottom) and use these as backgrounds for the appropriate div.
your layout would be something like this...

<body>
<div id="container">
<div id="left_col">
<div class="left_top">
</div>
<div class="left">
</div>
<div class="left">
</div>
<div class="left">
</div>
</div>
<div id="center_col">
<div class="center_banner">
</div>
<div class="center_nav">
</div>
<div class="center_content">
</div>
</div>
<div id="right_col">
<div class="right">
</div>
<div class="right">
</div>
<div class="right">
</div>
<div class="right_bottom">
</div>
</div>
</div>
</body>


Smaller images, re-usable css classes for the divs that are really the same and you have control over the design with css...
Oh... and you use REAL TEXT instead of putting everything in images.

I would suggest putting Dreamweaver away and learning some basic html and css... in the end life will be a lot easier.