Team 1444 Redesign [Archive]

Compnerd

01-15-2008, 11:29 PM

I got bored today, and completely redesigned our website in proper CSS, because i was having issues with the last one. I need some comments on the new site.

http://www.first1444.com/alternate

old: http://www.first1444.com

Please post and let me know which one looks better. The new one has some work left, but its the basic design (none of the links work on the new one.. it's just the design)
Also, what would i do to center the new site??

Thanks,
Compnerd

cjtenny

01-15-2008, 11:53 PM

Hey, I redid ours yesterday too!

http://www.waylandfirst.com/

Minimalistic, nice. Temporary team name.

However, just fyi, there's a web development forum. Might wanna move this there. I already made the same mistake of posting it here haha.

Compnerd

01-15-2008, 11:57 PM

Hey, I redid ours yesterday too!

http://www.waylandfirst.com/

Minimalistic, nice. Temporary team name.

However, just fyi, there's a web development forum. Might wanna move this there. I already made the same mistake of posting it here haha.

This is in the website forum..

RyanCesiel

01-16-2008, 11:54 AM

Nice site, everything seems kind of big though. I'm not sure if you're trying to achieve a 3D look. Looking at your banner is the only thing that makes it look 3D.

I made this site (http://usf-clan.net/main/index.php) for my America's Army gaming clan awhile ago - the clan no longer exists but the site is still up. What I mean by 3D look is what you see here (http://usf-clan.net/main/index.php).

cjtenny

01-16-2008, 12:32 PM

Oops, I thought I'd got to this page from the general forum. I guess it was from the portal.

Timothy D. Ginn

01-16-2008, 01:45 PM

Also, what would i do to center the new site??

margin-left: 10%;
margin-right: 10%;

for the divs that are containers. See details about centering (http://www.maxdesign.com.au/presentation/center/) for more.

RyanCesiel

01-16-2008, 02:57 PM

For centering you're going to need to add a container around everything that you have right now (still inside the <body></body> tags). It'd be something like:

#container {
margin: 0 auto;
}

That's quicker and does the same job, I use that all the time for fixed layout. Tim has a the code for a liquid layout according to the link he provided

Compnerd

01-16-2008, 04:21 PM

Ok i will try the centering fix. Also, what do you mean by big?? On my laptop screen it's difficult to adjust for smaller monitors. Any suggestions?

RyanCesiel

01-16-2008, 04:26 PM

Ok i will try the centering fix. Also, what do you mean by big?? On my laptop screen it's difficult to adjust for smaller monitors. Any suggestions?
Sorry about that, I meant that the font sizes and typography don't seem to match between your header, navigation, and content.

Compnerd

01-16-2008, 05:13 PM

Sorry about that, I meant that the font sizes and typography don't seem to match between your header, navigation, and content.

What do you suggest for font sizes?

RyanCesiel

01-16-2008, 05:49 PM

What do you suggest for font sizes?
14px to 30px Arial for titles/headings and 11px to 14px Verdana or Tahoma. I would recommend only bolding things that are important, it looks like everything on the front page is bolded.

RyanCesiel

01-16-2008, 06:41 PM

Your site doesn't and will not align with the margin-left: 10%; margin-right: 10% thing, that's for liquid layouts. Check my post on centering to do it properly.

Compnerd

01-16-2008, 10:42 PM

Also, how do I make the Links on the left side (in list format with the bullet points disabled) How do i make them appear with boxes around them??? I have the following CSS code applied to that..
#links {
position:absolute;
padding-left:0px;
background-color:#FFFFFF;
border-color:#000000;
height:211px;
width:120px;
font-family:tahoma;
font-size:16px;
left: 10px;
top: 125px;
border-style:solid;
}
.links {
display:block;
list-style:none;
padding:0px;
margin:0px;
}

RyanCesiel

01-17-2008, 11:31 AM

Also, how do I make the Links on the left side (in list format with the bullet points disabled) How do i make them appear with boxes around them??? I have the following CSS code applied to that..
#links {
position:absolute;
padding-left:0px;
background-color:#FFFFFF;
border-color:#000000;
height:211px;
width:120px;
font-family:tahoma;
font-size:16px;
left: 10px;
top: 125px;
border-style:solid;
}
.links {
display:block;
list-style:none;
padding:0px;
margin:0px;
}
This is the way I would do it, you can also do it through a <ul> list (http://w3schools.com/css/css_list.asp), also.

CSS:
.links dl {
margin: 0; /* Prevents moving the list way to the right */
padding: 0; /* Prevents moving the list way to the right */
}

.links dt {
border: 1px solid COLOR HERE; /* Creates the border around the links - like you asked for */
}

HTML:

<dl>
<dt>LINK CODE HERE</dt>
<dt>and HERE ..</dt>
<dt>and HERE .....</dt>
</dl>

flightofone

01-17-2008, 12:44 PM

I kinda like how it grabs your eyes, clean, easy-to-navigate. I especially like "I got bored so I redesigned..." as opposed to the usual "I'm bored, let's play video games, go out shopping, IM me, etc." :)

Compnerd

01-17-2008, 11:44 PM

I kinda like how it grabs your eyes, clean, easy-to-navigate. I especially like "I got bored so I redesigned..." as opposed to the usual "I'm bored, let's play video games, go out shopping, IM me, etc." :)

Ya.. boredom actually gets me to be quite creative.

Compnerd

01-17-2008, 11:51 PM

This is the way I would do it, you can also do it through a <ul> list (http://w3schools.com/css/css_list.asp), also.

CSS:
.links dl {
margin: 0; /* Prevents moving the list way to the right */
padding: 0; /* Prevents moving the list way to the right */
}

.links dt {
border: 1px solid COLOR HERE; /* Creates the border around the links - like you asked for */
}

HTML:

<dl>
<dt>LINK CODE HERE</dt>
<dt>and HERE ..</dt>
<dt>and HERE .....</dt>
</dl>

I really apriciate all your help! This is the first time i've done a website in 100% CSS coding.

Thanks!

RyanCesiel

01-18-2008, 11:13 AM

I really apriciate all your help! This is the first time i've done a website in 100% CSS coding.

Thanks!
No problem. :)

Compnerd

01-28-2008, 12:12 AM

Our site is pretty much done, there are a few enhancements still planned, but im ready for more ideas!

Thanks!