Jump to content

Seeking good tips on usage of CSS professional websites I want to design


Recommended Posts

I am at the moment having a bash at doing a clients website purely using html, decent professional standard xhtml which ever doc type is preffered, at the moment I am using transitional xhtml, which I believe to be the best solution for what I am wanting to do, am I right in thinking this for a clients photography portfolio site?

 

http://www.hsmedia.co.uk/njhdigital/#

 

What I was also wanting to know, if you look at my CSS which is as follows:

 

@charset "utf-8";
/* CSS Document */

/*
General notes about the colour scheme
Purple border colour is: #8c486f
Just an average black background as per the business card.
*/

/* Maybe set a background colour atm? */

.page_container {
background-color:#FFFFFF;
clear:none;
float:none;
height:auto;
margin-left:auto;
margin-right:auto;
width:900px;
}

/* This part needs modifying to enchance colour schemes to NJH Digital */
a.nav, a.nav:link, a.nav:visited {
display:block;
width:150px;
height:50px;
background:#d586b3;
margin-top:2px;
text-align:center;
text-decoration:none;
font-family:verdana, arial, sans-serif;
font-size:12px;
color:#000000;
line-height:50px;
overflow:hidden;
float:left;
}

a.nav:hover {
color:#ffffff;
background:#bf6397;
}

a.nav:active {
color:#ffffff;
background:#bf6397;
}

 

The html is:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>NJH Digital</title>
<link href="skinstyle.css" rel="stylesheet" type="text/css" />
</head>

<body>
<!-- Page container, restricts page width not size! -->
<div class="page_container">

<!-- Page Menu Bar -->
<a class="nav" title="Home" href="#">Home</a>
<a class="nav" title="" href="#">About</a>
<a class="nav" title="" href="#">Portfolio</a>
<a class="nav" title="" href="#">Contact</a>
<a class="nav" title="" href="#">Contact</a>
</div>

</body>

</html>

 

Is there anyway I can more centralise the top menu? I mean not using my shoddy old skills in CSS, that frankly where pathetic to be really honest, think the best way to learn is to ask the pro's here, always been able to help me in the past and thought this would be quite good to ask here.

 

Anyone got any tips on this and bumping up my css layout?

 

Any help as usual is greatly appreciated,

Jeremy.

Hey actually your page container is centered..

The problem is:

The width of one anchor is 150px and you have 5 anchors..

So total width is:150*5=750px;

However your page container is 900px..So it doesnt look centered..

Try giving the width of the page container as 750px

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.