Zymic Forums

Webmaster resources

Zymic IRC Server

Chat in real time at irc.zymic.com - Learn More

Welcome

Welcome to the Zymic webmaster forums. Our forums are here to provide people the free ability to discuss a range of websites related topics such as design, development coding and marketing.

In order to post you will need to register for a zymic account or if you already have one simply login by using the form on the left.

left Zymic Webmaster ForumsWeb Design & DevelopmentReviewsGraphic Design right
2 Pages V  < 1 2   Closed Topic Start new topic
left
Template :), Work in progress!
 right
Luke
post May 25 2008, 12:39 PM
Post #21


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
Anyone??

This is what I want - http://lukeburns.com/templates/pg.jpg

(sorry for double post)
Go to the top of the page 
 
  + Quote Post
Jacob
post May 25 2008, 12:48 PM
Post #22


Outrageously Uber Ninja
*******

Group: Moderators
Posts: 5,140
Joined: 11-May 08
From: Australia
Member No.: 25,876
It's getting there man.

Jacob.
Go to the top of the page 
 
  + Quote Post
Luke
post May 25 2008, 12:50 PM
Post #23


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
I'm done with the design... I just want to successfully code it! I always run into problems when coding and can never finish it!

http://lukeburns.com/templates/

Can anyone help with that??? There are a few problems if you don't notice...
Go to the top of the page 
 
  + Quote Post
Banjo
post May 25 2008, 02:26 PM
Post #24


Marvellous Ninja
******

Group: Moderators
Posts: 581
Joined: 25-October 07
From: Windsor, UK
Member No.: 1,866
Ok iv messed around with a few thing and have come up with this. Not tested so it might not work.

Replace your css with this:
CODE
body {
background: url(images/background.jpg) repeat-x;
background-attachment: fixed;
font-family: Verdana, Helvetica, Times New Roman, Times, serif;
}

#container {
margin: 0 auto;
width: 652px;
min-height: 564px;
}

#header {
background-image: url(images/header.jpg);
font-size: 2.3em
width: 652px;
height: 114px;
color: #ffffff;
}

#navigation {
font-size: .8em;
background-image: url(images/navigation.jpg);
width: 652px;
height: 25px;
line-height: 25px;
text-align: center;
}

ul {
display: inline;
}

li {
list-style: none;
display: inline;
}

#body {
backhground-image: url(images/body.jpg);
width: 652px;
min-height: 397px;
}

#footer {
background-image: url(images/footer.jpg);
width: 652px;
height: 28px;
color: #ffffff;
}


and

Replace your html with this:
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Purple Glare</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="container">
<div id="header">
<p>Purple Glare</p>
</div>

<div id="navigation">
<ul>

<li>Home</li>
<li>About</li>
<li>Resume</li>
<li>Gallery</li>
<li>Contact</li>
</ul>
</div>

<div id="body">

</div>

<div id="footer">&copy; Copyright 2008 Luke Burns</div>
</div>
</body>
</html>


Your question about vertical align, lets take the navigation for example its 25px high so to make the text in vertically align you write line-height: 25px;

so your navigation would look like this:

CODE
#navigation {
  font-size: .8em;
  background-image: url(images/navigation.jpg);
  width: 652px;
  height: 25px;
  line-height: 25px;
  text-align: center;
}


and for the navigation to be centered in IE iv changed the container code and added

CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">


to the html file.
Go to the top of the page 
 
  + Quote Post
Luke
post May 25 2008, 03:07 PM
Post #25


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
Alright... so most of that is fixed. But I've noticed the nav contents is a bit right of the center... like there's a left padding in the nav (but not on the right when aligned right). The navigation isn't centered. Suggestions?
Go to the top of the page 
 
  + Quote Post
Luke
post May 25 2008, 04:37 PM
Post #26


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
Okay... so I fixed some stuff... added a few things. Check it out: http://lukeburns.com/templates

I don't do javascript (yet) but I was thinking there would be some way to make the hover over the header a bit smoother. Fade? Something... just some additional thoughts. Hopefully I'm learning smile.gif
Go to the top of the page 
 
  + Quote Post
Banjo
post May 25 2008, 05:47 PM
Post #27


Marvellous Ninja
******

Group: Moderators
Posts: 581
Joined: 25-October 07
From: Windsor, UK
Member No.: 1,866
My suggestion is don't have the hover just keep 1 image for the header. Also the hover at the moment doesn't work in IE6
Go to the top of the page 
 
  + Quote Post
Luke
post May 25 2008, 05:51 PM
Post #28


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
I was just messin around smile.gif but other than that... anything else I should work on? change?
Go to the top of the page 
 
  + Quote Post
Banjo
post May 25 2008, 06:02 PM
Post #29


Marvellous Ninja
******

Group: Moderators
Posts: 581
Joined: 25-October 07
From: Windsor, UK
Member No.: 1,866
Not that i can think of, looks fine to me.
Go to the top of the page 
 
  + Quote Post
Luke
post May 25 2008, 06:06 PM
Post #30


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
Okay... thanks.
Go to the top of the page 
 
  + Quote Post
Paradoks
post May 25 2008, 07:48 PM
Post #31


Super Ninja
****

Group: Members
Posts: 313
Joined: 12-December 07
From: Glendale CA
Member No.: 4,714
Is there supposed to be white at the bottom? and the fact that the navigation is just a gradient ticks me off smile.gif chagne it to something else as a hover over effect, maybe a gloss or something smile.gif
Go to the top of the page 
 
  + Quote Post
Brandon
post May 25 2008, 09:48 PM
Post #32


Outrageously Uber Ninja
Group Icon

Group: Community Helper
Posts: 1,756
Joined: 11-November 07
From: HouseMaybe?
Member No.: 2,689
Hey Great work smile.gif.. Im not so keen on the navigation but apart from that masive improvement smile.gif
Good Work.
Go to the top of the page 
 
  + Quote Post
Luke
post May 25 2008, 10:56 PM
Post #33


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
Changed the navigation... and what white part are you talking about... in the body?? I had to have that fade out because it was not a pattern and looked bad repeating.
Go to the top of the page 
 
  + Quote Post
Jacob
post May 26 2008, 01:52 AM
Post #34


Outrageously Uber Ninja
*******

Group: Moderators
Posts: 5,140
Joined: 11-May 08
From: Australia
Member No.: 25,876
Good improvements bud. I hope you are learning from doing this project. I find the easiest way to learn is to do it.

Jacob.
Go to the top of the page 
 
  + Quote Post
Luke
post May 26 2008, 02:01 AM
Post #35


Super Duper Ninja
*****

Group: Members
Posts: 453
Joined: 8-October 07
From: PA
Member No.: 1,056
Yep! I learned a lot... I just need to work on experience now... only one way to do that smile.gif
Go to the top of the page 
 
  + Quote Post
« Next Oldest · Graphic Design · Next Newest »
 
2 Pages V  < 1 2
 Closed Topic Start new topic
left
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
 right
0 Members:
left
Forum Jump
 right
 
Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

Lo-Fi Version Time is now: 19th June 2013 - 10:44 PM
Powered By IP.Board 2.2.2 © 2013  IPS, Inc.