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

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.


SLGray
Administrator
Administrator

Male Posts : 36748
Reputation : 2449
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.

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.


SLGray
Administrator
Administrator

Male Posts : 36748
Reputation : 2449
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?

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.


SLGray
Administrator
Administrator

Male Posts : 36748
Reputation : 2449
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.

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

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