Zikula Community

• jen
  
  

  • Rank: Registered User
  • Registered: Feb 12, 2010
  • Last visit: Feb 15, 2010
  • Posts: 38

  Posted: May 29, 2011 - 05:47 PM

  I am learning how to work with styles in themes. Right now I have two problems. Go to http://66.147.238.20/~sb02com/index.php.
  
  Problem #1: Look to the right side. There is a green image. It is suppose to go across not down. In other words it should be across just the top of the block. The image is bowhunting16.gif.
  
  Problem #2: I am trying to put a space between each block.
  
  What changes do I need to make to get this to work.
  
  Here is my style sheet.
  
  Thanks in advance.
  
  /* andreas09 v1.0 (Dec 10th 2005) - An open source template by Andreas Viklund - http://andreasviklund.com. Free to use for any purpose as long as the proper credits are given to the original author. */
  
  body {
  background:#8b8b8b;
  color:#303030;
  font:76% Verdana,Tahoma,Arial,sans-serif;
  margin:0;
  padding:0;
  text-align:center;
  }
  
  a {
  color:#505050;
  font-weight:bold;
  text-decoration:none;
  }
  
  a:hover {
  color:#808080;
  text-decoration:underline;
  }
  
  p {
  line-height:1.5em;
  margin:0 0 15px;
  }
  
  /*** Main container ***/
  
  #container {
  background:#f0f0f0 URL(../images/bodybg.jpg) repeat-x;
  color:#303030;
  margin:0;
  min-width:770px;
  padding:0;
  text-align:left;
  width:100%;
  }
  
  /*** Header section ***/
  
  #sitename {
  color:#ffffff;
  height:92px;
  margin:0 20px 10px;
  text-align:left;
  }
  
  #sitename h1,#sitename h2 {
  font-weight:400;
  letter-spacing:-2px;
  margin:0;
  padding:0;
  }
  
  #sitename h1 {
  font-size:2.4em;
  padding-top:20px;
  }
  
  #sitename h2 {
  font-size:1.6em;
  }
  
  /*** Horizontal menu ***/
  
  #mainmenu {
  float:left;
  margin-bottom:25px;
  }
  
  #mainmenu ul {
  font-size:16px;
  margin:0;
  padding:0;
  }
  
  #mainmenu li {
  float:left;
  height:35px;
  list-style:none;
  margin:0;
  padding:0;
  }
  
  #mainmenu a {
  border-right:1px solid #b0b0b0;
  color:#606060;
  display:block;
  font-size:0.7em;
  padding:11px 10px 10px;
  text-transform:uppercase;
  }
  
  #mainmenu a:hover {
  background:#f0f0f0 URL(../images/menuhover.jpg) top left repeat-x;
  color:#505050;
  text-decoration:none;
  }
  
  #mainmenu a.current {
  background:#f0f0f0 URL(../images/menuhover.jpg) top left repeat-x;
  color:#505050;
  text-decoration:none;
  }
  
  /*** Content wrap ***/
  
  #wrap {
  clear:both;
  font-size:0.9em;
  padding:0;
  }
  
  /*** Sidebars ***/
  
  #leftside,#rightside {
  margin:0;
  padding:0 10px 10px;
  width:165px;
  border:1px solid black;
  margin:0px;
  padding-bottom: 10px;
  }
  
  #leftside {
  float:left;
  margin-right:10px;
  }
  
  #leftside{
  text-indent:5px;
  background-color: #D7D6B7;
  border-bottom-color: #000000;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  font-weight: bold;
  }
  
  #rightside{
  text-indent:5px;
  background-color: #739484;
  border-bottom-color: #000000;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  font-weight: bold;
  }
  
  #rightside {
  float:right;
  margin-left:10px;
  }
  
  
  #rightside {
  background-image: URL(../images/bowhunting_16.gif);
  background-repeat: repeat-y;
  }
  
  
  #leftside h4,#rightside h4 {
  color:#505050;
  font-size:1.6em;
  font-weight:bold;
  letter-spacing:-1px;
  margin:0 0 12px;
  }
  
  #leftside h2,#rightside h2 {
  font-size:1.1em;
  margin:0 0 20px;
  }
  
  #leftside p,#rightside p {
  font-size:0.9em;
  line-height:1.4em;
  margin:0 0 16px 10px;
  }
  
  .pn-bkey-menu {
  list-style:none;
  margin:0 0 16px 10px;
  padding:0;
  }
  
  .pn-bkey-menu li {margin-bottom:0.7em;}
  
  .rightcontent {
  background-image: URL(../images/bowhunting_14.gif);
  background-repeat: repeat-y;
  }
  .leftside {
  background-image: URL(../images/bowhunting_16.gif);
  background-repeat: repeat-y;
  }
  
  /*** Content ***/
  
  #content,#contentalt {
  background-color:#fafcff;
  border:1px solid #909090;
  color:#2a2a2a;
  padding:15px 20px 5px;
  }
  
  #content {margin:0 200px;}
  #contentalt {margin:0 200px 0 20px;}
  
  #content h1,#content h2,#contentalt h1,#contentalt h2 {
  background-color:inherit;
  color:#606060;
  font-size:1.8em;
  font-weight:bold;
  letter-spacing:-1px;
  margin:0 0 15px;
  padding:0;
  }
  
  #content h2,#contentalt h2 {
  font-size:1.6em;
  margin-bottom:10px;
  }
  
  #content img,#contentalt img {
  border:1px solid #b0b0b0;
  margin:5px 15px 6px;
  padding:5px;
  }
  #content a img, #contentalt a img {
  border:1px solid #b0b0b0;
  margin:0px;
  }
  #content div.pn-adminformbuttons button img{
  margin:0px;
  }
  
  /*** Footer ***/
  
  #footer {
  background:#8b8b8b URL(../images/footerbg.jpg) top left repeat-x;
  clear:both;
  color:#d0d0d0;
  font-size:0.9em;
  font-weight:bold;
  margin:0;
  padding:20px 0;
  text-align:center;
  width:100%;
  }
  
  #footer a {
  color:#d0d0d0;
  font-weight:bold;
  }
  
  /*** Various classes ***/
  
  .thumbnail {
  background:#fafbfc;
  border:1px solid #b0b0b0;
  margin:0 0 10px 10px;
  padding:5px;
  }
  
  .searchform {margin:0;}
  
  .searchbox {
  background:#f0f0f0;
  border:1px solid #b0b0b0;
  margin:0 4px 0 0;
  width:100px;
  }
  
  .searchbutton {
  background:#f0f0f0;
  border:1px solid #b0b0b0;
  }
  
  .clearingdiv {
  clear:both;
  height:30px;
  width:1px;
  }
  
  .hide {display:none;}
  
  /*** Text format ***/
  
  .intro {
  font-size:1.1em;
  font-weight:bold;
  letter-spacing:-1px;
  }
  
  .small {font-size:0.8em;}
  .large {font-size:1.4em;}
  .center {text-align:center;}
  .right {text-align:right;}
  
  /*** End of file ***/

  • 
  •  
• nestormateo
  
  

  • Rank: Team Member
  • Registered: Sep 06, 2006
  • Last visit: May 09, 2010
  • Posts: 2446

  Posted: May 29, 2011 - 07:37 PM

  Hi Jen
  have you figured out the right side image?
  
  about the Blocks spacing, you can sort that with a top-bottom margin:
  

  Code

  .pn-blockposition-left,
  .pn-blockposition-right {
      margin: 10px 0 25px;
  }

  
  
  Greetings
  
  --
  - Mateo T. -
  Mis principios... son mis fines

  • 
  •  
• DavidJ
  
  

  • Rank: Softmore
  • Registered: Jan 22, 2008
  • Last visit: Apr 04, 2010
  • Posts: 130

  Posted: May 29, 2011 - 09:08 PM

  If you are using Firefox the Firebug extension will help you with style sheets http://getfirebug.com/
  
  --
  David
  

  • 
  •  
• jen
  
  

  • Rank: Registered User
  • Registered: Feb 12, 2010
  • Last visit: Feb 15, 2010
  • Posts: 38

  Posted: May 30, 2011 - 04:25 AM

  nestormateo I tried that and it didn't do anything that I can see.
  
  DavidJ, I got getfirebug. Looks pretty complicated for a novice like me.
  
  The one thing I have learned in the last 16 working hours on this is that this stuff is not for novices. I would think there has to be a theme out there that is similiar to my 3col www.strictlybowhunting.com theme. I just haven't found it.
  
  It also seems that alot of themes are using XHTML and style sheets versus HTML and style sheets. I wonder if that is a newer technology thing or just preference.
  
  I recently purchased dreamweaver cs5 thinking that I would magically be able to create themes at will. It seems I am way behind knowledge wise. After 16 hours I am a little smarter but still at square one on this project.

  • 
  •  
• HalbrookTech
  
  

  • Rank: Developer
  • Registered: Dec 31, 1969
  • Last visit: Jun 01, 2010
  • Posts: 6859

  Posted: May 30, 2011 - 06:28 AM

  The base 960theme is a 3 column with nav bar and header area. Just have to tweak the colors in the CSS and add the graphics.
  
  --
  Home Page | Find on Facebook | Follow on Twitter
  

  • 
  •  
• ccandreva
  
  

  • Rank: Developer
  • Registered: Sep 22, 2005
  • Last visit: May 20, 2010
  • Posts: 292

  Posted: May 31, 2011 - 07:07 AM

  What Firebug does is let you view the CSS rules that are active for a section of your site. It lets you find what you need to edit.
  
  It looks like you've fixed a those things you mentioned ?

  • 
  •  
• jen
  
  

  • Rank: Registered User
  • Registered: Feb 12, 2010
  • Last visit: Feb 15, 2010
  • Posts: 38

  Posted: May 31, 2011 - 01:10 PM

  No I did not fix them. I gave up. After 16 hours of trying to learn the stuff I realized it just wasn't worth my time. I am going a different direction for development. I do appreciate your help from all those that put up with my questions. Thanks.

  • 
  •  
•  
•  

Users on-line

• 0 users

This list is based on users active over the last 60 minutes.