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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    links in my columns don't work and can't put images together.

    I think the problem is something to do with the fact that I have the left column defined as .leftcol and the right column is both #column and .rightcol. But beyond that I'm baffled. None of the links within the container work and I can't do something like a thumbnail gallery because it won't put more than one image going across, just down.

    Here is a page - http://www.comebackdemos.com/camelot/season.html
    the orange is where the links are supposed to be.

    And my css:

    Code:
    @import url(navi.css);
    @import url(forms.css);
    @import url(tables.css);
    
    
    body{
    	margin:0;
    	padding:0;
    	font-size:12px;
    	font-family:Calibri, "Palatino Linotype", "Book Antiqua", "Trebuchet MS", serif;
            color:#FFFFFF;
    	background-color:#CBCFB5;
    
    	}
    
    img{
    	display:block;
    	border:0;
    	margin-top: 0;
    	margin-right: 15;
    	margin-bottom: 15px;
    	margin-left: 0;
    	text-align: right;
    	vertical-align: middle;
    	padding-right: 0px;
    	
    }
    .justify{text-align:justify;}
    .bold{font-weight:bold;}
    .center{text-align:center;}
    .right{text-align:right;}
    .nostart {list-style-type:none; margin:0; padding:0;}
    .clear{clear: both;}
    br.clear{clear:both; margin-top:-15px;}
    a{
    	outline:none;
    	text-decoration:none;
    	color: #333333;
    }
    
    .fl_left{float:left;}
    .fl_right{float:right;}
    
    .imgl, .imgr{border:1px solid #666666; padding:6px;}
    .imgl{float:left; margin:0 8px 8px 0; clear:left;}
    .imgr{float:right; margin:0 0 8px 8px; clear:right;}
    
    /* ----------------------------------------------Wrapper-------------------------------------*/
    
    div.wrapper{
    	display:block;
    	width:100%;
    	margin:0;
    	text-align:left;
    	background-color: #CBCFB5;
    	}
    
    div.wrapper h1, div.wrapper h2, div.wrapper h3, div.wrapper h4, div.wrapper h5, div.wrapper h6{
    	margin:0 0 15px 0;
    	padding:0 0 8px 0;
    	font-size:medium;
    	font-weight:normal;
    	font-family:Georgia, "Times New Roman", Times, serif;
    	border-bottom:1px dotted #362C20;
    	}
    
     
    
    .leftcol{
    	color:#362C20;
    	background-color:#FFFFFF;
    	float: none;
    	width: 655px;
    	padding: 0px 10px 10px;
    	height: 95%;
    	font-family: Calibri, "Palatino Linotype", "Book Antiqua", "Trebuchet MS", serif;
    	font-size: 12px;
    }
    
    .rightcol{
    	color:#362C20;
    	background:#362C20 url(/images/orange.png) repeat fixed;
    	float: right;
    	width: 250px;
    	padding: 0px 10px 10px;
    	height: 95%;
    	font-family: Calibri, "Palatino Linotype", "Book Antiqua", "Trebuchet MS", serif;
    	font-size: 14px;
    	font-style: normal;
    	font-weight: bold;
    }
    
    .col1{color:#FFFFFF; background-color:#CBCFB5; border-top:5px solid #362C20;}
    .col2{color:#B6B6B6; background:#362C20;}
    .col2 a{color:#FF9900; background-color:#362C20;}
    .col3{color:#666666; background-color:#FFFFFF;}
    .col4{color:#666666; background-color:#C8CCB3;}
    .col4 a{color:#55392B; background-color:#C8CCB3;}
    .col5, .col5 a{color:#FFFFFF; background-color:#585C3F;}
    
    /* ----------------------------------------------Generalise-------------------------------------*/
    
    #header, #intro, #container, #breadcrumb, #footer, #copyright{
    	position:relative;
    	margin:0 auto 0;
    	display:block;
    	width:960px;
    	}
    
    /* ----------------------------------------------Header-------------------------------------*/
    
    #header{
    	z-index:1000;
    	color:#444444;
    	background-color:#CBCFB5;
    	padding-top: 10px;
    	padding-right: 0;
    	padding-bottom: 90px;
    	padding-left: 0;
    	}
    
    #header #logo{
    	display:block;
    	float:left;
    	margin-top:8px;
    	}
    
    #header h1, #header p{
    	margin:0;
    	padding:0;
    	font-size: 12px;
    	font-weight: bold;
    	}
    
    #header h1{
    	margin:0;
    	padding:0;
    	font-size:50px;
    	border:none;
    	}
    
    #header h1 a{
    	color:#362C20;
    	background-color:#CBCFB5;
    	}
    
    /* ----------------------------------------------Homepage Intro-------------------------------------*/
    
    #intro{
    	padding:20px 20px 20px 20px;
    	}
    
    .wrapper #intro li.last{
    	margin:0;
    	}
    
    #intro h1, #intro h2, #intro p, #intro ul{
    	margin:0;
    	padding:0;
    	list-style:none;
    	line-height:normal;
    	border:none;
    	}
    
    #intro .fl_left{
    	display:block;
    	float:left;
    	width:480px;
    	}
    
    #intro .fl_left h1{
    	margin-bottom:20px;
    	font-size:42px;
    	color:#CBCFB5;
    	background:#362C20;
    	border:none;
    	}
    
    #intro .fl_left h2{
    	margin:0 0 10px 0;
    	padding:0 0 8px 0;
    	color:#FFFFFF;
    	background:#362C20;
    	border-bottom:1px dotted #666666;
    	}
    
    #intro .fl_left li{
    	display:block;
    	float:left;
    	width:220px;
    	margin:0 25px 0 0;
    	}
    
    #intro .fl_left p{
    	margin-bottom:10px;
    	line-height:1.3em;
    	}
    
    #intro .fl_left p.readmore{
    	display:block;
    	margin:25px 0 0 0;
    	text-align:right;
    	line-height:normal;
    	}
    
    #intro .fl_right{
    	display:block;
    	float:right;
    	width:420px;
    	height:320px;
    	padding:9px;
    	border:1px solid #CBCFB5;
    	overflow:hidden;
    	}
    
    #intro .fl_right li{
    	margin-bottom:10px;
    	}
    
    #intro .fl_right img{
    	display:block;
    	width:420px;
    	height:320px;
    	}
    
    /* ----------------------------------------------BreadCrumb-------------------------------------*/
    
    #breadcrumb{
    	padding:20px 20px 20px 20px;
    	background-color: #362C20;
    	}
    
    .wrapper #breadcrumb li.last{
    	margin:0;
    	}
    
    #breadcrumb {height:45px;}
    
    #breadcrumb ul{	
    	padding:0;
    	list-style:none;
    	}
    
    #breadcrumb ul li{display:inline;}
    #breadcrumb ul li.current a{text-decoration:underline;}
    
    #breadcrumb li img {float:left;padding:5px;}
    
    #breadcrumb ul {margin:0;padding:0;}
    
    /* ----------------------------------------------Container-------------------------------------*/
    
    
    
    #container{
    	border-top-width: thin;
    	border-right-width: thin;
    	border-bottom-width: thin;
    	border-left-width: inherit;
    	border-top-style: none;
    	border-right-style: none;
    	border-bottom-style: none;
    	border-left-style: none;
    	font-variant: normal;
    	text-decoration: none;
    	font-size: 12px;
    	padding: 0px 20px 20px;
    	text-wrap: unrestricted;
            margin: 0 auto;
    	float: none;
    	width: 960px;
    	color: #362C20;
    	background-color: #FFF;
    	font-family: Calibri, "Palatino Linotype", "Book Antiqua", "Trebuchet MS", serif;
    	overflow: hidden;
    	position: relative;
    	top: 0px;
    	}
    
    #container a{
    	color:#FF9900;
    	background-color:#FFFFFF;
    	}
    
    .brown {background-color:#362c20;}
    
    .white {background-color:#fff;}
    
    
    
    
    
    /* ----------------------------------------------Homepage Latest-------------------------------------*/
    
    #latest{
    	display:block;
    	width:100%;
    	padding:0 0 30px 0;
    	margin:0 0 30px 0;
    	border-bottom:1px dotted #362C20;
    	}
    
    #latest ul, #latest p{
    	margin:0;
    	padding:0;
    	list-style:none;
    	display:inline;
    	}
    
    #latest h2{
    	margin:20 0 0px;
    	padding:0 0 8px;
    	font-size:12px;
    	font-weight:bold;
    	border-bottom:1px dotted #000000;
    	color: #362C20;
    	}
    
    #latest li{
    	display:block;
    	float:left;
    	width:300px;
    	margin:20px 30px 0 0;
    	padding:0;
    	font-size: 12px;
    	color: #362C20;
    	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif, Calibri;
    	}
    
    #latest li.last{
    	margin-right:0;
    	font-size: 12px;
    	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif, Calibri;
    	margin-top: 20px;
    }
    
    #latest li p.imgholder{
    	display:block;
    	width:290px;
    	height:100px;
    	margin:0 0 15px 0;
    	padding:4px;
    	border:1px solid #362C20;
    	}
    
    #latest a{
    	font-weight:bold;
    	}
    
    /* ----------------------------------------------Content-------------------------------------*/
    
    #content{
    	display:block;
    	float:left;
    	width:inherit;
    	}
    
    #content #latestnews{
    	display:block;
    	width:960px;
    	margin-bottom:35px;
    	}
    
    #content #latestnews h2, #content #latestnews p{
    	margin:0;
    	padding:0;
    	line-height:1.6em;
    	}
    
    #content #latestnews h2{
    	margin-bottom:10px;
    	}
    
    #content #latestnews ul, #content #latestnews li{
    	display:block;
    	width:100%;
    	margin:0;
    	padding:0;
    	list-style:none;
    	}
    
    #content #latestnews li{
    	margin:0 0 15px 0;
    	padding:0 0 15px 0;
    	border-bottom:1px dotted #666666;
    	}
    
    #content #latestnews div.imgholder{
    	display:block;
    	float:left;
    	width:150px;
    	height:150px;
    	margin:0;
    	padding:4px;
    	border:1px solid #666666;
    	}
    
    #content #latestnews div.latestnews{
    	display:block;
    	float:right;
    	width:420px;
    	margin:0;
    	padding:0;
    	}
    
    #content #latestnews p.readmore{
    	display:block;
    	margin-top:10px;
    	text-align:right;
    	font-weight:bold;
    	}
    
    /* ------Comments-----*/
    
    #comments{margin-bottom:40px;}
    
    #comments .commentlist {margin:0; padding:0;}
    
    #comments .commentlist ul{margin:0; padding:0; list-style:none;}
    
    #comments .commentlist li.comment_odd, #comments .commentlist li.comment_even{margin:0 0 10px 0; padding:15px; list-style:none;}
    
    #comments .commentlist li.comment_odd{color:#666666; background-color:#F7F7F7;}
    #comments .commentlist li.comment_odd a{color:#FF9900; background-color:#F7F7F7;}
    
    #comments .commentlist li.comment_even{color:#666666; background-color:#E8E8E8;}
    #comments .commentlist li.comment_even a{color:#FF9900; background-color:#E8E8E8;}
    
    #comments .commentlist .author .name{font-weight:bold;}
    #comments .commentlist .submitdate{font-size:smaller;}
    
    #comments .commentlist p {margin:10px 5px 10px 0; padding:0; font-weight: normal;text-transform: none;}
    
    #comments .commentlist li .avatar{float:right; border:1px solid #EEEEEE; margin:0 0 0 10px;}
    
    /* ----------------------------------------------Right Block-------------------------------------*/
    
    #column{
    	display:block;
    	float:right;
    	width:250px;
    	height: 95%;
    	background-color: #996;
    	font-family: Calibri, "Palatino Linotype", "Book Antiqua", "Trebuchet MS", serif;
    	font-size: 14px;
    	font-weight: bold;
    	color: #362C20;
    	margin: 0px;
    	padding: 0px 10px 10px;
    	background-attachment: scroll;
    	background-image: url(../images/orange.png);
    	background-repeat: repeat;
    	background-position: left top;
    	border: 1px solid #000;
    	}
    
    #column .holder, #column #featured{
    	display:block;
    	width:300px;
    	margin-bottom:40px;
    	}
    
    #column .holder p{
    	line-height:1.6em;
    	}
    
    #column .holder h2.title{
    	display:block;
    	width:100%;
    	height:65px;
    	margin:0;
    	padding:15px 0 8px 0;
    	font-size:20px;
    	font-weight:normal;
    	color:#666666;
    	background-color:#FFFFFF;
    	line-height:normal;
    	}
    
    #column .holder h2.title img{
    	float:left;
    	margin:-15px 8px 0 0;
    	padding:5px;
    	border:1px solid #666666;
    	}
    
    #column .holder p.readmore{
    	display:block;
    	width:100%;
    	font-weight:bold;
    	text-align:right;
    	line-height:normal;
    	}
    
    #column div.imgholder{
    	display:block;
    	width:290px;
    	margin:0 0 10px 0;
    	padding:4px;
    	border:1px solid #666666;
    	}
    	
    /* Featured Block */
    
    #column #featured a{
    	color:#FF9900;
    	background-color:#F9F9F9;
    	}
    
    #column #featured ul, #column #featured h2, #column #featured p{
    	margin:0;
    	padding:0;
    	list-style:none;
    	}
    
    #column #featured li{
    	display:block;
    	width:250px;
    	margin:0;
    	padding:20px 25px;
    	color:#2E271D;
    	background-color:#F9F9F9;
    	}
    
    #column #featured li p{
    	line-height:1.6em;
    	}
    
    #column #featured li p.imgholder{
    	display:block;
    	width:240px;
    	height:90px;
    	margin:20px 0 15px 0;
    	padding:4px;
    	border:1px solid #666666;
    	}
    
    #column #featured li h2{
    	margin:0;
    	padding:0 0 14px 0;
    	font-size:20px;
    	font-weight:normal;
    	font-family:Georgia, "Times New Roman", Times, serif;
    	line-height:normal;
    	}
    
    #column #featured p.more{
    	display:block;
    	width:100%;
    	margin-top:15px;
    	font-weight:bold;
    	text-align:right;
    	line-height:normal;
    	}
    
    
    .flickrbox ul{
    	margin:0;
    	padding:0;
    	list-style:none;
    	}
    	
    .flickrbox li{
    	display:block;
    	float:left;
    	width:80px;
    	height:80px;
    	margin:0 15px 15px 0;
    	padding:4px;
    	border:1px solid #666666;
    	}
    
    .flickrbox li.last{margin-right:0;}
    
    /* ----------------------------------------------Footer-------------------------------------*/
    
    #footer{
    	padding:20px 0;
    	margin-top: 5px;
    	}
    
    #footer h2{
    	margin-bottom:10px;
    	border-bottom-color:#98989A;
    	}
    
    #footer p, #footer ul, #footer a{
    	margin:0;
    	padding:0;
    	font-weight:normal;
    	list-style:none;
    	line-height:normal;
    	}
    
    #footer .footbox{
    	display:block;
    	float:right;
    	width:600px;
    	margin:0 0 0 15px;
    	padding:5;
    	}
    
    #footer li{
    	margin-bottom:3px;
    	}
    
    #footer .last{
    	margin:0;
    	}
    
    #newsletter{
    	display:block;
    	float:left;
    	width:300px;
    	font-size: 14px;
    	}
    
    /* ----------------------------------------------Copyright-------------------------------------*/
    
    #copyright{
    	padding:10px 0;
    	}
    
    #copyright p{
    	margin:0;
    	padding:0;
    	}
    thank you!

  • #2
    Regular Coder djh101's Avatar
    Join Date
    May 2009
    Location
    California
    Posts
    614
    Thanks
    48
    Thanked 64 Times in 64 Posts
    The links work fine for me.
    "Yeah science!"
    Online Science Tools


  •  

    Tags for this Thread

    Posting Permissions

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