Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jun 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Need CSS and HTML Help!

    Hello,
    Im working on a WebDesign for a Client
    He asked me to make a One Page Template! its really easy but my CSS skills suck
    i dont know what to add to css
    the html file is created but i dont know what to add to css???

    Here is the Code of the HTML:
    Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>BrandCrew - Portfolio</title>
    
    <meta name="description" content="Portfolio of BrandCrew - A Web &amp; Graphic Design group from Europe." />
    
    <link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
    
    <head>
    <style type="text/css">
    body {background-image:url('img/bg.jpg');}
    </style>
    </head>
    
    <body>
    	<div id="page-wrap">
    		<div id="container">
    			<div id="header">
                	<center><a href="#" title="BrandCrew"><img src="img/logo.png" alt="BrandCrew" /></a></center>
                    <a href="#" title="About"><img src="img/slogan.png" alt="BrandCrew" /></a>
                </div><!--Header-->
                
                <div id="portfolio" class="clear">
                	<ul>
                    	<li><a href="img/work1.png" title="Clear Logo Design"><img src="img/work1.png" alt="Portfolio thumbnail" /></a></li>
                        <li><a href="img/work2.png" title="Revolution Website Design"><img src="img/work2.png" alt="Portfolio thumbnail" /></a></li>
                        <li><a href="img/work3.png" title="Amazing Dragon Style"><img src="img/work3.png" alt="Portfolio thumbnail" /></a></li>
                        <li><a href="img/work4.png" title="Leading Edge Logo Design"><img src="img/work4.png" alt="Portfolio thumbnail" /></a></li>
                        <li><a href="img/work5.png" title="Sneakers Illustration"><img src="img/work5.png" alt="Portfolio thumbnail" /></a></li>
                        <li><a href="img/work6.png" title="Geometric Lines Illustration"><img src="img/work6.png" alt="Portfolio thumbnail" /></a></li>
                    </ul>              
                </div><!--Portfolio-->
                
                <div id="footer" class="clear">
                    <ul class="clear">
                    	<li><a href="mailto:chris@spoongraphics.co.uk" title="Email"><img src="img/email.png" alt="Contact us via email" /></a></li>
                        <li><a href="http://www.facebook.com/" title="Facebook"><img src="img/facebook.png" alt="Like Us at Facebook!" /></a></li>
    					<li><a href="http://twitter.com/" title="Twitter"><img src="img/twitter.png" alt="Follow us at Twitter!" /></a></li>
    					<li><a href="http://flickr.com/" title="Flickr"><img src="img/flickr.png" alt="Follow us at Flickr!" /></a></li>
    					<li><a href="http://deviantart.com/" title="DeviantArt"><img src="img/deviantart.png" alt="View our Amazing Work!" /></a></li>
                    </ul>
                    <p class="copyright">&copy; 2012 BRANDCREW - EKWORKS</p>
                </div><!--Footer-->
    
    		</div><!--Container-->
    	</div><!--Page Wrap-->
    </body>
    </head>
    </html>
    I wanted it to look like this:


    But it looks like this (HTML):


    What a kind of css to add? can anyone help me?

    The DeadLine ends in 3 day's!

    The one who can help me get a free Logo Design :)

  • #2
    New Coder
    Join Date
    May 2011
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You need to just add within your style header at top. style details same as you have for body but with you container and body id's (background-image.../../image/image.jpg) no-repeat top centre.)
    and colours and fonts ect.

    if you are using DW then just start this with the id and use the asy links on drop downs to see what you can define for each.

  • #3
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,861
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    What's there inside your current css/style.css ? Could you post a link to your page?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #4
    New Coder
    Join Date
    Nov 2010
    Location
    Virginia,USA
    Posts
    36
    Thanks
    1
    Thanked 7 Times in 7 Posts
    Seeing your stylesheet would help. But even without it this is what I would do;

    Take your images out of the list elements and place them in divs that are floated left(or right) for your body images. Place a line break between every other div so there is 2 on each line. Do not use a line break for the social buttons in the footer.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •