I got some more done here- www.neastsolar.com/test/Home. The only problem I am having now is centering and the nav. bar (suprise!). With centering, i have a <div id="wrapper"> around the entire body w/ an external css linked to the page, however has you can see the page is not centered. My coding seems to be fine. Also, in I.E. 8 the nav bar at "General Solar Info" doesnt expand, but in firefox it does. Is there a fix for this. Besides the pages rendering a bit different in IE vs. Firefox, everything else seems to be fine.
Fixed it by adding "doc type" to the header. I should be all set now, just got to finish building this page and the 20 or so others (thank god for CSS). Question about CSS though, is it possible to have the navigation bar in an external CSS, meaning when I want to add/edit links I just edit a .css doc rather then all the pages it has the code on? Also, how would I add a background color, where the content (the 800px width) stays white but the rest has a color? Thanks
If you turn your pages into .php instead of html, you can use php includes for your menu. You write the html and the css code as usual, just give your html files the .php extension instead. Here is an easy explanation: http://www.pixieplots.co.nz/forum/viewt … =4&t=3
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
awesome! although it doesn't show up until I upload it, but no big deal! This is alot easier now. Anyone know the answer to my other question?
"how would I add a background color, where the content (the 800px width) stays white but the rest has a color? Thanks "
"how would I add a background color, where the content (the 800px width) stays white but the rest has a color? Thanks "
Vito Buonomano wrote:
"how would I add a background color, where the content (the 800px width) stays white but the rest has a color? Thanks "
"how would I add a background color, where the content (the 800px width) stays white but the rest has a color? Thanks "
Vito,
CSS is the answer.
body {
background-color:#ff0000;
}
#wrapper{
background-color:#ffffff;
}
If I did that correctly, the entire screen should have a red background, except everything inside the wrapper div.
If you have a div inside your wrapper that you want to have a green background, just set that using your CSS.
Awesome, decided to go with yellow. Pretty much finished the home page and the about us page (neastsolar.com/test/aboutus). I had to edit some links in the nav bar and cant tell you how fulfilling it was to be able to just edit the css file; and I linked the color to an external css as well. Youll see for my "footer" I have a blue bar (a .jpg pic) and a textbox w/ white lettering over it. Is there anyway to group the textbox and bluebar together so when I move them they move together? Should I just make the footer one picture file and then link it w/ css?, although not so sure how to make it go to the bottom of every page automatically.
Do you have PHP on your site? I think I saw a 404.php while onb your site, so I suspect that you do have PHP.
You can put your footer code (an nothing else) into a single file named footer.php. Then every page can have a line of code like:
<?php include($DOCUMENT_ROOT . "footer.php"); ?>
You can use CSS to position the parts of your site. I have a page that I want to have the footer at the bottom of the browser, and scroll the middle of the page, keeping the top and bottom of the page constant. Another forum member here (Cary) pointed me in the right direction, and provided a lot of help. That code looks like this:
The key is the div id of bottom. The CSS for that is:
The bottom is set by CSS to be at a bottom position of 0 and has a height that I adjusted to 75 px to just hold what I have in the footer. It does need a graphic as a background so that the middle of the page is hidden behind the footer as the middle text scrolls under the footer.
Hope this gives you some good ideas.
You can put your footer code (an nothing else) into a single file named footer.php. Then every page can have a line of code like:
<?php include($DOCUMENT_ROOT . "footer.php"); ?>
You can use CSS to position the parts of your site. I have a page that I want to have the footer at the bottom of the browser, and scroll the middle of the page, keeping the top and bottom of the page constant. Another forum member here (Cary) pointed me in the right direction, and provided a lot of help. That code looks like this:
<div id="bottom">
<div id="footer">
<?php include($DOCUMENT_ROOT . "footer.php"); ?>
</div> <!-- close footer div -->
</div><!-- close the fixed bottom div -->
<div id="footer">
<?php include($DOCUMENT_ROOT . "footer.php"); ?>
</div> <!-- close footer div -->
</div><!-- close the fixed bottom div -->
The key is the div id of bottom. The CSS for that is:
#bottom {
position:absolute;
left:0;
right:0;
bottom:0;
height:75px;
text-align:center;
background-image:url('background.gif');
overflow:hidden;
}
position:absolute;
left:0;
right:0;
bottom:0;
height:75px;
text-align:center;
background-image:url('background.gif');
overflow:hidden;
}
The bottom is set by CSS to be at a bottom position of 0 and has a height that I adjusted to 75 px to just hold what I have in the footer. It does need a graphic as a background so that the middle of the page is hidden behind the footer as the middle text scrolls under the footer.
Hope this gives you some good ideas.
I actually used a PHP link, but then bypassed CSS and just set the "Top" for the Textbox and blue bar to 100% and it seems to work in IE and Firefox. I did the similar thing to the header. The Logo, Header and footer are linked from logo.inc.php. I would have made seperate php link files but didnt have time so I might do that soon. Otherwise it works great and its so easy for me to change any of those. I would have posted back that I did that already but I cant edit older posts so.....
Right now its just a struggle getting things to match up w/ IE VS. Firefox. For instance, www.neastsolar.com/photogallery , its just a COffecup Photo Gallery slideshow, however when I added the code to the page and positioned it in HTML Editor viewer, it goes crazy in Firefox. In I.E., its where I positoned it in the Viewer, but in Firefox it isnt. A few other similiar things happen with the headings on the pages, i.e. "contact us" etc., which are textboxes but seem to move around no matter what I do to the code.
Right now its just a struggle getting things to match up w/ IE VS. Firefox. For instance, www.neastsolar.com/photogallery , its just a COffecup Photo Gallery slideshow, however when I added the code to the page and positioned it in HTML Editor viewer, it goes crazy in Firefox. In I.E., its where I positoned it in the Viewer, but in Firefox it isnt. A few other similiar things happen with the headings on the pages, i.e. "contact us" etc., which are textboxes but seem to move around no matter what I do to the code.
Vito Buonomano,
I cannot check your site with IE. Corporate policy is that I use IE6. Where do you expect the photo gallery to be located?
I cannot check your site with IE. Corporate policy is that I use IE6. Where do you expect the photo gallery to be located?
Hmm, yeah sorry about that but as said in the troubleshooting page, I.E. 6 wont expand the CSS menu, so I decided not to deal with that. Is there an easy fix for that? (nav menu is in neastsolar.com/config/menu.inc.php) But I seemed to have remedied the problem of the photo gallery moving in IE vs. Firefox. However, the last remaining problem that I cant conquer is the problem of moving object. In particular, the head shot on www.neastsolar.com/aboutus , no matter where I place it, whether using px's, percentages, relative, absolute, it moves pending on the resolution of the user. FOr instance where the picture shows up on 1024x768 and 1200x768 is very different. the effect can be recreated by zooming in w/ firefox. It must be just that pic though becasue everything stays where it should be. The same thing now happens with the PhotoGallery object, as well as certain headers on page (like "contact us") but again its so weird that only certain objects on some pages move, while all the others remain where they are.
Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.