March 26, 200818 yr Hi, I am a n00b when it comes to web design, but I have been given the job of designing my clans web site. So I was wondering I have made a mock up on photoshop of what I want it to sort of look like, and was hoping that someone could post some code that will get me on my way? I have also added some code that I have been using as a mock but it is not working as I hoped it would. Here is the link to the image: http://www.manchesters-armed-defenders.co....ages/design.gif and here is my sad effort for some code lol : <body> <div style="background: #000000"> <img src="http://www.manchesters-armed-defenders.co.uk/logo.png"> <div id="menu" align="right" > <a href="http://www.manchesters-armed-defenders.co.uk/">HOME</a> | <a href="">CONTACT</a> | <a href="">ABOUT</a> </div> </div> </body> <div style="background: #374560"> <center><br> </div> <div><center><img src="http://www.manchesters-armed-defenders.co.uk/top1.jpg"></div> Now I would really like to know how I can get the black & dark blue small headers to go right across the page rather than stopping near the end of the page, leaving a white section on the left and right hand sides. Thanks Danny
March 26, 200818 yr Hi, I am a n00b when it comes to web design, but I have been given the job of designing my clans web site. So I was wondering I have made a mock up on photoshop of what I want it to sort of look like, and was hoping that someone could post some code that will get me on my way? I have also added some code that I have been using as a mock but it is not working as I hoped it would. Here is the link to the image: http://www.manchesters-armed-defenders.co....ages/design.gif and here is my sad effort for some code lol : <body> <div style="background: #000000"> <img src="http://www.manchesters-armed-defenders.co.uk/logo.png"> <div id="menu" align="right" > <a href="http://www.manchesters-armed-defenders.co.uk/">HOME</a> | <a href="">CONTACT</a> | <a href="">ABOUT</a> </div> </div> </body> <div style="background: #374560"> <center><br> </div> <div><center><img src="http://www.manchesters-armed-defenders.co.uk/top1.jpg"></div> Now I would really like to know how I can get the black & dark blue small headers to go right across the page rather than stopping near the end of the page, leaving a white section on the left and right hand sides. Thanks Danny If i get you right, i think you should go back to the css file and then reduce the width of the header to match the other sections or just reduce your image width to the same size as the rest of the page.
March 26, 200818 yr Make sure that in your css the body has no margin or padding: body { margin: 0px; padding: 0px; }
March 26, 200818 yr Make sure that in your css the body has no margin or padding: body { margin: 0px; padding: 0px; } What Eric said. Site looks fantastic. One thing on a 20 inch Mac screen in 1680*1050 the 4 content areas text is completely unreadable as in tiny. Then again it's just a .gif file...so might be sorted in coding.
March 27, 200818 yr I'm guessing you are currently using html rather than css. If you can use css then it's a matter of taking the layout and spliting it up into the containers and the pieces you need. You've got some pretty clear colums and containers there, so it "should" be easier to split everything up. I'd recomend you google css column layouts, and there's some good tutorials out there on the net. Personally, I've learnt a lot on http://woork.blogspot.com about the basics behind how to work things out. I've done a quick layout of how you could cut your site up. Also if you wanted to start from some kind of starting off point, something like THIS or something similar could be worth a look, you can add more containers to suit the layout and can probably work with it to get something basic up and running. For your bar across the top, you could either do it by 100% width background colours in divs, or if there are gradients involved you can take a 2 pixel slice and then repeat it 100% width. That'll mean it fills the screen, much like a tiled desktop would. BUT, I would say I've only been learning css a short while, so don't take it as gospel, but the forum's more experienced posters can probably point out any flaws in my dastardly plans . There are probably several
March 27, 200818 yr Author Thanks everyone for your replies and suggestions. Big thanks to DustyWeeks for posting the helpful image. Thanks Dan
Create an account or sign in to comment