The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Image Spacing Issues

View previous topic View next topic Go down

Solved Image Spacing Issues

Post by Xanthis on March 24th 2013, 12:39 am


URL: http://sonicommunity.forumotion.com/forum

1: The forum icons are overlapping the forum titles and descriptions, I've set all templates to default and reviewed my CSS, adjusted the images in pics management, and I still can't get a good padding between the image and text.

2: The images in the navbar are spaced oddly even though the images themselves are cropped to fit.

Here's my full CSS if you can find or notice something I didn't, which is highly likely:

Spoiler:
Code:
.pun tbody.statused span.status {
  img: url("http://hitskin.com/themes/18/82/24/i_category.png"(;
}

.paged-head {
  border-radius : 16px;
    -webkit-border-radius : 16px;
    -moz-border-radius : 16px;
}

.paged-foot {
  border-radius : 16px;
    -webkit-border-radius : 16px;
    -moz-border-radius : 16px;
}
 
#pun-about {
display: none;
}

.pun .user .user-info {
        color: #666666;
        line-height: 1.8em;
    }

.postmain blockquote {
   padding: 0.5em 1em;
   background-color: #fff;
   border: 2px ridge #296FA5;
        -moz-box-shadow: 0 0 5px #000000;
        -webkit-box-shadow: 0 0 5px #000000;
        box-shadow: 0 0 5px #000000;
   }

    blockquote {
        background: url("http://i43.servimg.com/u/f43/14/73/12/96/quote_11.png") no-repeat scroll 1px 5px #333333;
        -webkit-border-radius: 16x;
        -moz-border-radius: 16px;
        border-radius: 16px;
        font-size: 0.95em;
        margin: 0px 0px 5px 0px;
        overflow: hidden;
        padding: 0px;
        opacity: 0.7;
        font-style: oblique;
        margin-left:10px;
        margin-top:10px;
        background-color:transparent;
        border-radius: 5px;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
    }
.postmain cite {
      margin: 0px 0px 0px 5px;
      background-color:transparent;
}

/*---General---*/

table.forumline {
   background-color: #ffffff;
   border: none;
   }

.pun .user-ident .username {
/*text-transform: capitalize;*/
text-align: center;
position: relative;
margin-bottom: 10px;
font-family: Verdana;
}

body {
  background-image:url('http://i49.servimg.com/u/f49/17/29/37/87/backgr10.jpg'), url('http://i49.servimg.com/u/f49/17/29/37/87/tobere10.jpg');
  background-repeat: no-repeat, repeat-y;
  background-position: top, center bottom;
}

#page-body {
  background-color: #ffffff;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  width: 800px;
  position: relative;
  left: 50%;
  margin-left: -400px;
}


#pun-about {
  background-color: transparent;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 270px;
  height: 20px;
  position: relative;
  left: 0%;
  margin-left: 260px;
}
 

#pun-intro {
  background-color: transparent;
  border: none;
  margin-top: 50px;
  width: 700px;
  height: 387px;
  background-image:url('http://i35.servimg.com/u/f35/13/05/30/24/sonic_16.png');
  background-repeat: no-repeat;
  margin-left: 50px;
}

#pun-logo {
  background-repeat: no-repeat;
  margin-left: 50px;
  width: 700px;
  height: 200px;
}

#pun-visit,.main-box {
background-color: transparent;
border: none;
}

.main .main-head {
background-image: url('http://i.imgur.com/ogrpc.png');
background-color: transparent;
background-repeat: x-repeat;
}


/*---Navbar---*/

#pun-head #pun-navlinks {
background-image:url('http://i49.servimg.com/u/f49/17/29/37/87/navbac11.png');
width: 950px;
height: 200px;
position: relative;
left: 50%;
background-repeat: no-repeat;
background-color: transparent;
margin-bottom: -50px;
margin-left: -475px;
}

#pun-navlinks ul {
margin-top: 55px;
}

#pun-navlinks li a {
margin-left: -10px;
}

#i_icon_mini_portal {
width: 160px;
height: 50px;
background-image: url(http://i49.servimg.com/u/f49/17/29/37/87/home10.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center bottom;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}


#i_icon_mini_index {
width: 160px;
height: 50px;
background-image: url(http://i49.servimg.com/u/f49/17/29/37/87/forum10.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center bottom;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}


#i_icon_mini_profile {
width: 160px;
height: 50px;
background-image: url(http://i49.servimg.com/u/f49/17/29/37/87/ucp10.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center bottom;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}



#i_icon_mini_login {
width: 160px;
height: 50px;
background-image: url(http://i49.servimg.com/u/f49/17/29/37/87/login10.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center bottom;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}



#i_icon_mini_logout {
width: 160px;
height: 50px;
background-image: url(http://i46.servimg.com/u/f46/13/26/04/18/logout12.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center bottom;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}



#i_icon_mini_new_message {
width: 160px;
height: 50px;
background-image: url(http://i46.servimg.com/u/f46/13/26/04/18/new_me11.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center top;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}



#i_icon_mini_message {
width: 160px;
height: 50px;
background-image: url(http://i49.servimg.com/u/f49/17/29/37/87/inbox10.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center bottom;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}


#i_icon_mini_register {
width: 160px;
height: 50px;
background-image: url(http://i49.servimg.com/u/f49/17/29/37/87/signup10.png), url(http://illiweb.com/fa/empty.gif);
background-position: center bottom, center bottom;
background-repeat: no-repeat;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
}

/*---Links---*/

a:hover{
 text-decoration: none;
 }
a:active{
 text-decoration: none;
 }
a:visited{
 text-decoration: none;
 }
a.forumtitle {
text-decoration: none;
}
.pun a:hover {
 }

.i_icon_quote {
background: url(http://i46.servimg.com/u/f46/13/26/04/18/th/quote10.png) no-repeat;
width: 87px;
height: 38px;
}

.i_icon_edit {
background: url(http://i46.servimg.com/u/f46/13/26/04/18/th/edit10.png) no-repeat;
width: 66px;
height: 38px;
}

.i_icon_delete {
background: url(http://i20.servimg.com/u/f20/15/00/35/26/delete10.png) no-repeat;
width: 93px;
height: 38px;
}

.i_icon_thank {
background: url(http://i20.servimg.com/u/f20/15/00/35/26/thank10.png) no-repeat;
width: 105px;
height: 38px;
}

.i_icon_report {
background: url(http://i20.servimg.com/u/f20/15/00/35/26/report10.png) no-repeat;
width: 105px;
height: 38px;
}



.i_post {
background: url(http://i20.servimg.com/u/f20/15/00/35/26/topic10.png) no-repeat;
width: 163px;
height: 68px;
}

.i_reply {
background: url(http://i20.servimg.com/u/f20/15/00/35/26/reply10.png) no-repeat;
width: 163px;
height: 68px;
}

a:hover{
    text-decoration: none !important;
    }
    a{
    text-decoration: none !important;
    }

.pun .post .user {
text-align: center;
}

.pun .user-ident .username {
color: #00569C;
display: block;
font-size: 1.2em;
font-weight: 700;
margin-top: -1px;
padding-bottom: 20px;
top: 0;
}

/*---Chatbox customization---*/

img[src="http://illiweb.com/fa/resize.gif"] {
    display: none !important;
    }

#refresh_auto {
  color: black;
}
#chatbox_option_co {
  color: black;
}
#chatbox_option_disco {
  color: black;
}
#message.post {
  -webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
#submit_button {
  display: none;
}
#chatbox > p span.user > span strong, #chatbox_members ul a span:first-child strong {
  display: none;
}
#chatbox > p span.user > span:after, #chatbox_members ul a span:first-child:after {
 color: #105289!important;
  content: '';
  font-size: 10px;
}
h2.chatbox-title:after {
  content: "";
}
a.chat-title {
  display: none;
}
body.chatbox {
  background-image: url('http://farm4.static.flickr.com/3025/2627239517_f2408da505_o.jpg');
  background-color: black;
}
#chatbox_members, #chatbox, #chatbox_footer {
    background-color: #FFFFFF !important;
    }
    #chatbox_header.main-head {
  background-image: url("http://i36.servimg.com/u/f36/13/26/04/18/chatbo16.png");
  background-repeat: no-repeat;
}
h4.member-title.away {
  content: "Noobs";
}
h4.member-title.online {
  content: "Heroes";
  }
  body.chatbox {
    background: none repeat scroll 0 0 #FBFBFB !important;
    }

/*---Custom message tables---*/

.info, .success, .warning, .error, .mes, .tips, .chat, .cnb {
    margin: 10px 0px;
    padding: 10px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
    border-radius: 4px 4px 4px;
}

.info {
    background-color: #d1e4f3;
    background-image: url("http://cdn1.iconfinder.com/data/icons/musthave/24/Information.png");
    color: #00529B;
    border: 1px solid #4d8fcb;
}

.success {
    background-color: #effeb9;
    background-image: url("http://cdn3.iconfinder.com/data/icons/fatcow/32x32_0020/accept.png");
    color: #4F8A10;
    border: 1px solid #9ac601;
}
.warning {
    background-color: #ffeaa9;
    background-image: url("http://cdn3.iconfinder.com/data/icons/fatcow/32x32_0400/error.png");
    color: #9F6000;
    border: 1px solid #f9b516;
}
.error {
    background-color: #fccac3;
    background-image: url("http://cdn1.iconfinder.com/data/icons/CrystalClear/32x32/actions/messagebox_critical.png");
    color: #D8000C;
    border: 1px solid #db3f23;
}

.mes {
    background-color: #F2F2F2;
    background-image: url("http://cdn2.iconfinder.com/data/icons/fugue/bonus/icons-32/mail.png");
    border: 1px solid #AAAAAA;
    color: #545454;
}

.tips {
    background-color: #FEEAC9;
    background-image: url("http://cdn5.iconfinder.com/data/icons/woocons1/Light%20Bulb%20On.png");
    border: 1px solid #D38E49;
    color: #bb640c;
}

.chat {
    background-color: #daecfb;
    background-image: url("http://cdn2.iconfinder.com/data/icons/drf/PNG/iChat.png");
    border: 1px solid #2078c9;
    color: #066ac4;
}



/*---Headings and pagination---*/

.pun .main, .pun .main-category {
   margin: 1em 0;
   }
.main .main-head, .main .main-foot {
   padding: 0.7em 1.3em;
   font-weight: normal;
   color: #4c5366;
   background-color: #1f537b;
   }

.pun {
        line-height: 130%;
        margin: 0 auto;
        min-width: 768px;
        padding: 5px;
        width: 800px;
 
}

.frm-buttons {
        border-top-style: hidden !important;
    margin-bottom: 1em  !important;
    }

a:hover{
      opacity:0.65;
      -moz-opacity: 0.65;
      filter: alpha(opacity=65);
      }

#pun-visit {
    font-size: 0px !important;
    }

#pun-visit, .main-box{
    Display: none !important;
    }

.main .main-foot {
          background-color:  #FFFFFF;
    }


  .main-foot {
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    }

.postprofile  a img:hover {
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
 
  -webkit-transform:rotate(180deg);
  -moz-transform:rotate(180deg);
  -o-transform:rotate(180deg);
    }

.pun .frm-form {
        background-img: url('http://i48.servimg.com/u/f48/17/48/49/15/photo10.png')!important;
    }
   
.name a {
        font-size:  15px;
    }

.entry-content {
        margin-top: 1em;
    }

.codebox, code{
            background-color: #FFFFFF !important;
              border-color: #FFFFFF !important;
              color: #000000 !important;
            }

.avic img { border-radius: 10px 10px 10px 10px;   
}

.pun{
    opacity: .90;
    filter: alpha(opacity=70);
    -moz-opacity: .70;
    }

#pun-qpost .main-content {
        border-radius: 0 0 15px 15px;
    }
    #pun-qpost .main-head {
        border-radius: 15px 15px 0 0;
    }

/*---Further investigation required---*/

    .main .main-head {
    background-color: #FFFFFF;
    background-image: url("http://i24.servimg.com/u/f24/16/54/56/99/he10.png");
    background-position: 50% 50%;
    background-repeat: repeat-x;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25) inset, 0 1px 3px rgba(0, 0, 0, 0.3), 0 2px 0 rgba(255, 255, 255, 0.2) inset;
    color: white;
    font-size: 12px;
    font-weight: bold !important;
    margin-top: 15px;
    padding-bottom: 13px;
    padding-left: 13px;
    padding-right: 13px;
    padding-top: 13px;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    -webkit-border-radius: 4px 4px 4px 4px;
    -moz-border-radius: 4px 4px 4px 4px;
    border-radius: 4px 4px 4px 4px;
    }

#pun-qpost p.h2:before {
        content: "";
        visibility: visible;
    }
    #pun-qpost p.h2 {
        visibility: hidden;
    }

#quick_reply #textarea_content label {
        display: none;
    }

#pun-qpost p.options {
        display: none;
    }

#textarea_content label {
            display: none !important;
        }

.pun .main-content {
        border-radius: 5px 5px 5px 5px;
    }

/*---Rounded chatbox buttons---*/

.fontbutton {
  padding: 2px;
  cursor: pointer;
  text-align: left;
    border-radius:5px;
    -moz-border-radius:5px;
}


/*---Hide BBCode---*/

.exthelp {
  display: none;
}

/*---Further investigation required---*/

#profile-advanced-add {
    text-align: left;
    image: url('http://illiweb.com/fa/prosilver/bg_button.gif');
}

.pun .post {
    background-image: url('http://i46.servimg.com/u/f46/13/26/04/18/post_g18.png');
    background-repeat: repeat-x;
    border-color: #DEE5EB;
    border-style: solid none;
    border-width: .5px 0px 0px;
}

.pun .main-foot .options a, .pun .main-foot .options a:link, .pun .main-foot .options a:visited {
    color: #000000;
    padding: 5px;
    text-decoration: none;
}

.pun .paging {
    font-size: 1.2em;
    font-weight: 700;
    margin-left: auto;
    margin-right: auto;
}

/*---Reply background---*/

#textarea_content textarea {
    background: transparent url("http://i36.servimg.com/u/f36/13/26/04/18/sonic_11.png") no-repeat;
    background-position: center;
}

/*---Password strength background images---*/

    #pwd_good {
      background:url('http://img52.imageshack.us/img52/2378/strong.png');
      }
    #pwd_middle {
      background:url('http://img262.imageshack.us/img262/9555/medium.png');
      }
    #pwd_bad {
      background:url('http://img264.imageshack.us/img264/5695/weakg.png');
      }

/*---Link decoration---*/

a:link{
 text-decoration: none;
color: #00569C;
-webkit-transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   transition: all 1s ease-in-out;
 }
a:hover{
 text-decoration: none;
color: #00569C;
 }
a:active{
 text-decoration: none;
color: #00569C;
 }
a:visited{
 text-decoration: none;
color: #00569C;
 }
a.forumtitle {
text-decoration: none;
color: #00569C;
}
.pun a:hover {
   color: #AA0000;
text-shadow : 0px 0px 15px #FFF;
 }

.pun .user-ident .username {
color: #00569C;
display: block;
font-family: Verdana;
font-size: 1.2em;
font-weight: 700;
margin-bottom: 0px;
margin-top: -2px;
padding-bottom: 1px;
position: relative;
text-align: center;
top: 0;
}

.fontbutton_normal {
background: #FFF;
}

#divstrike.fontbutton {
  display: none;
}

#divbold.fontbutton {
  display: none;
}

#divitalic.fontbutton {
  display: none;
}

#divunderline.fontbutton {
  display: none;
}

#pun-about #qjump {
display: none;
}


Last edited by Xanthis on March 24th 2013, 4:04 am; edited 1 time in total
avatar
Xanthis
Forumember

Male Posts : 210
Reputation : 6
Language : English

Back to top Go down

Solved Re: Image Spacing Issues

Post by SLGray on March 24th 2013, 1:01 am

When I press the link, I get a white page with a Forumotion link.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 38485
Reputation : 2589
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Image Spacing Issues

Post by Xanthis on March 24th 2013, 4:04 am

I apologize, the link's been edited.
avatar
Xanthis
Forumember

Male Posts : 210
Reputation : 6
Language : English

Back to top Go down

Solved Re: Image Spacing Issues

Post by SLGray on March 24th 2013, 4:19 am

It says there is no forums.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 38485
Reputation : 2589
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Image Spacing Issues

Post by Xanthis on March 24th 2013, 4:25 am

Try now?
avatar
Xanthis
Forumember

Male Posts : 210
Reputation : 6
Language : English

Back to top Go down

Solved Re: Image Spacing Issues

Post by SLGray on March 24th 2013, 4:45 am

1. Administration Panel > General > Forum > Configuration
Pages Structures Section
Image cell's height category/board:
Image cell's width category/board:

2. How exactly are the images spaced oddly?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 38485
Reputation : 2589
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: Image Spacing Issues

Post by Xanthis on March 24th 2013, 9:03 am

Thank you, and nevermind, it's resolved now.
avatar
Xanthis
Forumember

Male Posts : 210
Reputation : 6
Language : English

Back to top Go down

Solved Re: Image Spacing Issues

Post by Jophy on March 24th 2013, 9:12 am

Topic Solved & Locked
avatar
Jophy
ForumGuru

Male Posts : 17924
Reputation : 835
Language : English
Location : Somewhere

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum