SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    please help me clean this up - i need suggestions

    the point of css is to minimize repetition of styling but when i started to make this site i foudn myself doing this :

    Code:
    #nav_node_committees {
    	background-image: url(images/nav_committees.png);
    	background-repeat: no-repeat;
    	width:130px;	
    	height:97px;
    	margin-left: 10px;
    	margin-top: 10px;
    	padding-top:20px;
    
    }
    
    #nav_node_events {
    	background-image: url(images/nav_events.png);
    	background-repeat: no-repeat;
    	width:130px;	
    	height:97px;
    	margin-left: 10px;
    	margin-top: 10px;
    	padding-top:25px;
    
    }
    
    #nav_node_involvement {
    	background-image: url(images/nav_involvement.png);
    	background-repeat: no-repeat;
    	width:130px;	
    	height:97px;
    	margin-left: 10px;
    	margin-top: 10px;
    	padding-top:25px;
    
    }
    
    #nav_node_about {
    	background-image: url(images/nav_about.png);
    	background-repeat: no-repeat;
    	width:130px;	
    	height:97px;
    	margin-left: 10px;
    	margin-top: 10px;
    	padding-top:25px;
    
    }

    and the html was :

    Code:
    		<div id="nav_node_committees">
    			Entertainment<br />
    			Human Interest<br />
    			Marketing<br />
    			Music<br />
    			Special Events<br />
    			Non-Programming<br />
    		</div>
    		
    		<div id="nav_node_events"></div>
    		<div id="nav_node_involvement"></div>
    		<div id="nav_node_about"></div>
    as you can see the only thing that changes is hte background image
    i havent populated the other nav_nodes but they will have lines of
    text in there...

    so then any ideas as to how i can clean this up?

    this is what the images look like



    its just a text label and a dashed box....

    im wondering can i create the dashed box in CSS and put the title/label tag attached to it somehow?

    thanks for any comments ideas!!!!

  2. #2
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    okay thanks that looks sharp...

    i had no idea you could style it using two classes....makes sense tho
    i just couldnt think of it =]

    i'll jsut change the images to be only the label and change the colors a bit to fit my site here:


    thanks vmuch!

  3. #3
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    any reason for the p tags at the end of the lists?

  4. #4
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    http://rcpc.rutgers.edu/betasite/test.php

    i changed a few things around....

    it should fit into here :

    http://rcpc.rutgers.edu/betasite/

    but the dashed borders aren't exactly what i was looking for

  5. #5
    SitePoint Member
    Join Date
    Aug 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    here's what i've done so far, you have been a tremendous help

    http://rcpc.rutgers.edu/betasite/

    instead of the UL i used a P tag because they will be links for navigation soon


    can i apply padding to the inside of the p tag? so the border isnt on top of the text?


Bookmarks

Posting Permissions

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