Hellooooo,
We are trying to surface the homepage of the website… I do the rough keeping in photoshop.. this also is my 1st attempt slicing….
Subsequent are my problems:
ONE. After the header, while i try to squeeze image followed from the nav-bar.. the nav-bar winds up behind the img. I tried this sometimes using a separate div for every part. Finally used to do it just one after another (without css.. just simply html). but i end up getting a gap bw the image and nav icon….
ONLY TWO. The same difference appears wen i try and put a bill under every gallery photo…
Feel i missing your code here The reason why dint my div space in CSS work
Any help is going to be appreciated….
<! DOCTYPE html code PUBLIC " -//W3C//DTD XHTML ONE. 0 Strict//EN"
" http: //www. w3. org/TR/xhtml1/DTD/xhtml1-strict. dtd" >
< html code xmlns=" http: //www. w3. org/1999/xhtml" xml: lang=" en" >
< head>
< meta http-equiv=" content-type" content=" text/html; charset=iso-8859-1" />
< meta name=" keywords" content=" " />
< meta name=" description" content=" " />
< hyperlink href = " html/css/main. css" rel = " stylesheet" type=" text/css" />
< title> artist< /title>
< /head>
< body>
< div course = " site-wrapper" >
< div course = " header-wrapper" >
< div course = " header-title" >
< img src = " html/images/logo. gif" width=" 260" height=" 120" />
< /div>
< /div>
< img src = " html/images/baby. png" width=" 965" height=" 435" />
< div class=" clear" > < /div>
< div course = " nav-bar" >
< ul>
< li > < the href=" #" > Home< /a> < /li>
< li> < the href=" #" > Galleries< /a> < /li>
< li> < the href=" #" > About< /a> < /li>
< li> < the href=" #" > Blog< /a> < /li>
< li> < the href=" #" > Contact< /a> < /li>
< /ul>
< /div>
< div class=" clear" > < /div>
< div class=" gallery_content" >
< img src=" html/images/belly. gif" width=" 275" height=" 220" />
< div class=" gallery_title" > Bellies< /div>
< /div>
< div class=" gallery_content" >
< img src=" html/images/babies. gif" width=" 275" height=" 220" />
< div class=" gallery_title" > Children & Children< /div>
< /div>
< div class=" gallery_content" >
< img src=" html/images/portrait. gif" width=" 275" height=" 220" />
< div class=" gallery_title" > Portraits< /div>
< /div>
< div class=" comm_content" >
< img src=" html/images/fb. gif" width=" 50" height=" 52" />
< /div>
< div class=" comm_content" >
< img src=" html/images/tw. gif" width=" 50" height=" 52" />
< /div>
< div class=" comm_content" >
< img src=" html/images/bl. gif" width=" 50" height=" 52" />
< /div>
< div class=" clear" > < /div>
< div class=" footer-wrapper" >
< the href=" #" > Home< /a> & nbsp; & nbsp; < the href=" # " > Gallery< /a> & nbsp; & nbsp; < the href=" # " > Artist< /a> & nbsp; & nbsp; < the href=" #" > Blog< /a> & nbsp; & nbsp; < the href=" #" > Contact< /a>
< p> Copyright CarolineBurgess. com< /p>
< p> & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; Designed by abcd efgh< /p>
< /div>
< /div>
< /body>
< /html>
/* CSS Document */
/*font-family: arial, helvetica, sans-serif, tahoma, verdana, geneva, lucida, " lucida grande";
html code, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form,
fieldset, desk, th, td
border: 0; padding: 0; contour: none; color: #f0f0ff;
< div course = " main-pic" >
< img src = " html/images/baby. png" />
< /div>
*/
entire body
font: 9pt/17pt arial;
border: 0px;
extra padding: 0px;
history: #f0f0f0;
contour: none;
. site-wrapper
width: 965px;
min-height: 1100px;
margin-left: automobile;
margin-right: automobile;
history: #ffffff;
. clear
clear: both;
. header-wrapper
width: 965px;
levels: 125px;
history: #ffffff;
. header-title
drift: left;
padding-left: 20px;
. nav-bar
screen: block;
width: 965px;
levels: 25px;
margin-left: automobile;
margin-right: automobile;
. nav-bar ul
list-style-type: nothing;
border: 0;
extra padding: 0;
flood: hidden;
. nav-bar li
drift: left;
. nav-bar the: link,. nav-bar the: visited
screen: block;
width: 193px;
levels: 25px;
font-weight: regular;
font-familyristina;
colouring: #b77461;
background-color: #4d3e2f;
text-align: middle;
font-size: 22px;
extra padding: 0px;
text-decoration: nothing;
. nav-bar the: hover,. nav-bar the: active
colouring: #ffffff;
background-color: #b77461;
. gallery_content
drift: left;
padding-top: 25px;
padding-left: 23px;
padding-right: 23px;
history: #ffffff;
. comm_content
drift: left;
padding-top: 75px;
padding-left: 15px;
history: #ffffff;
. gallery_title
text-align: middle;
font-familyristina;
levels: 25px;
font-size: 20px;
colouring: #b77461;
history: #4d3e2f;
width: 275px;
. footer-wrapper
drift: right;
screen: inline;
colouring: #c0c0c0;
font-size: 12px;
padding-right: 15px;
. footer-wrapper a
colouring: #c0c0c0;
font-size: 13px;
list-style-type: nothing;
text-decoration: nothing;
Wouldn’t your PS layout (sliced) be the background images of your respective page
Too bad you simply can’t upload everything on the net and show us what you will have (a link towards your URL).
We can not duplicate your material on our computers. How do we find out what it looks just like
I havent uploaded the positioning yet.
I am going to upload it in the near future… and then often be back..
Thanks to the reply..