Mysidia Adoptables Support Forum

Mysidia Adoptables Support Forum (http://www.mysidiaadoptables.com/forum/index.php)
-   Templates and Themes (http://www.mysidiaadoptables.com/forum/forumdisplay.php?f=26)
-   -   Another Theme Problem - Please Help! (http://www.mysidiaadoptables.com/forum/showthread.php?t=4020)

Hall of Famer 02-23-2013 11:22 PM

Quote:

Originally Posted by Abronsyth (Post 26050)
Hm, I'll just have to continue messing with it...I'm not familiar with using tables to set up a site theme, as Tequila suggested, so I'll have to test that out to see if that could possibly fix it.

((Mehp, I'm just a young person doing what young people do: coming to terms with myself...I be a trans*man. Now go feel uncomfortable ;-;))

I see, good luck playing with the css, I will probably look into it too since I believe I used to manipulate the position of profile tabs before. Its definitely doable.

lol you sound energetic, now I miss the days when I was young. Come to think of it, I see lots of gender benders on bigger forums, its rare to have one for a support forum of this scale though. XD

Abronsyth 02-24-2013 12:32 PM

Yeah, I'll have to see if I have the time today...last day of Mid-Winter break and I've a bit to do for school...

Gender bender is different from transsexual, but yeah, there are a lot of gender queers on the bigger forums. Now I feel special XD

Abronsyth 02-28-2013 04:43 PM

Okay, time for an update!

I have VERY LITTLE experience working with tables, so please bear with me in this.

I set up the content and footer as tables...and it turned out quite well except for one little problemo...for some reason my table.content class have been shoved way down...and I'm not sure what I could have accidentally done to have moved down so far.

Screen Shot

Here's my updated template.html:
HTML Code:

<!DOCTYPE html>
<head>
<title>:BROWSERTITLE:</title>
<link rel="stylesheet" href="media/style.css" type="text/css" />
</head>

<center><body>

<div id="header"><br><h1>Belles Ombres</h1></div>
<div id='cssmenu'>
<ul>
  <li><a href='index.php'><span>Home</span></a></li>
  <li class='has-sub'><a href='#'><span>World</span></a>
      <ul>
        <li><a href='explore.php'><span>Explore</span></a></li>
        <li><a href='shop.php'><span>Market</span></a></li>
        <li><a href='arcade.php'><span>Arcade</span></a></li>
        <li><a href='trade.php'><span>Trade</span></a></li>
        <li class='last'><a href='donate.php'><span>Bank</span></a></li>
      </ul>
  </li>
  <li class='has-sub'><a href='#'><span>Adopt</span></a>
      <ul>
        <li><a href='adopt.php'><span>Adoption Center</span></a></li>
        <li><a href='pound.php'><span>Shelter</span></a></li>
        <li><a href='pages.php?page=trivia'><span>Trivia</span></a></li>
        <li class='last'><a href='promo.php'><span>Redeem Code</span></a></li>
      </ul>
  </li>
  <li class='has-sub'><a href='#'><span>Community</span></a>
      <ul>
        <li><a href='/forum'><span>Forum</span></a></li>
        <li><a href='shoutbox.php'><span>Shout Box</span></a></li>
        <li><a href='profile.php'><span>Members</span></a></li>
        <li class='last'><a href='stats.php'><span>Stats</span></a></li>
      </ul>
  </li>
  <li class='has-sub'><a href='#'><span>Help</span></a>
      <ul>
        <li><a href='pages.php?page=guide'><span>Newbie Guide</span></a></li>
        <li><a href='pages.php?page=archives'><span>Archives</span></a></li>
        <li class='last'><a href='pages.php?page=catalog'><span>Items</span></a></li>
      </ul>
  </li>
  <li class='last'><a href='search.php'><span>Search</span></a></li>
</ul>
</div>
<div id="content">
<table class="content" align="center">
<tr><td>
<h2>:ARTICLETITLE:</h2>
:ARTICLECONTENT:</td><td class="menu">:SIDEFEED:</td></tr></table></div>

<div id="footer"><table class="footer"><tr><td><p>All content © <a

href="http://www.bellesombres.com/">
BellesOmbres</a> 2013 :: Powered by <a

href='http://www.mysidiaadoptables.com'>
Mysidia Adoptables</a></p></td></tr>
</div>

</body></center>

Here's my updated style.css:
HTML Code:

body {
background:#4D754B;background: rgb(222,239,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(222,239,255,1) 0%, rgba(152,190,222,1) 100%); /*

FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(222,239,255,1)),

color-stop(100%,rgba(152,190,222,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(222,239,255,1) 0%,rgba(152,190,222,1) 100%); /*

Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(222,239,255,1) 0%,rgba(152,190,222,1) 100%); /*

Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(222,239,255,1) 0%,rgba(152,190,222,1) 100%); /*

IE10+ */
background: linear-gradient(to bottom, rgba(222,239,255,1) 0%,rgba(152,190,222,1) 100%); /*

W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#deefff',

endColorstr='#98bede',GradientType=0 ); /* IE6-9 */
font-family:Arial, Tahoma, sans-serif;
font-size:12px;
color:#000000;
}

a {
color:#0489B1;
text-decoration:none;
}

a:hover {
color:#6CC7DC;
text-decoration:none;
}

#header {
        float:center;
        background: rgb(167,207,223); /* Old browsers */
        background: -moz-linear-gradient(top, rgba(167,207,223,1) 0%, rgba(35,83,138,1) 100%);

/* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba

(167,207,223,1)), color-stop        (100%,rgba(35,83,138,1))); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1)

100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /*

Opera 11.10+ */
        background: -ms-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /*

IE10+ */
        background: linear-gradient(to bottom, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%);

/* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a7cfdf',

endColorstr='#23538a',GradientType=0 ); /* IE6-9 */
width:800px;
height:100px;
border-top-left-radius:15px;
border-top-right-radius:15px;
padding:10px;
}

#header h1 {
font-size:30px;
color:#ffffff;
font-family:Arial;
letter-spacing:8px;
}

#cssmenu {width:820px;}

#cssmenu ul {margin: 0; padding: 7px 6px 0; background: #4C9ACE url(overlay.png) repeat-x 0

-110px; line-height: 100%; font: normal 12px Arial, Helvetica, sans-serif; -webkit-box-shadow: 0

1px 3px rgba(0,0,0, .4); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4);}
#cssmenu li {margin: 0 5px; padding: 0 0 8px; float: left; position: relative; list-style: none; }
#cssmenu a,
#cssmenu a:link {font-weight: bold; color: #ffffff; text-decoration: none; display: block; padding: 

8px 20px; margin: 0; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;       

 text-shadow: 0 1px 1px rgba(0,0,0, .3); }
#cssmenu a:hover {background: #000; color: #fff;}
#cssmenu .active a,
#cssmenu li:hover > a {background: #89BFE3 url(overlay.png) repeat-x 0 -40px; color: #444; -

webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2); -moz-box-shadow: 0 1px 1px rgba(0,0,0, .2);

box-shadow: 0 1px 1px rgba(0,0,0, .2); text-shadow: 0 1px 0 rgba(255,255,255, 1); }
#cssmenu ul ul li:hover a,
#cssmenu li:hover li a {background: none; border: none; color: #666; -webkit-box-shadow:

none; -moz-box-shadow: none;}
#cssmenu ul ul a:hover {background: #8f8f8f url(overlay.png) repeat-x 0 -100px !important;

color: #fff !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;

text-shadow: 0 1px 1px rgba(0,0,0, .1);}
#cssmenu li:hover > ul {display: block;}
#cssmenu ul ul {display: none; font-size: 10px; margin: 0; padding: 0; width: 185px; position:

absolute; top: 40px; left: 0; background: #ddd url(overlay.png) repeat-x 0 0; border: solid 1px

#b4b4b4; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-

box-shadow: 0 1px 3px rgba(0,0,0, .3); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .3); box-

shadow: 0 1px 3px rgba(0,0,0, .3);}
#cssmenu ul ul li {float: none; margin: 0; padding: 3px; }
#cssmenu ul ul a {font-weight: normal; text-shadow: 0 1px 0 #fff; }
#cssmenu ul:after {content: '.'; display: block; clear: both; visibility: hidden; line-height: 0; height:

0;}
* html #cssmenu  ul {height: 1%;}

#content {
background:#ffffff;
width:800px;

padding:10px;
}

table.content {
background:#ffffff;
text-align:center;
width:800px;
}

td.menu {
background:#DCEFF7;
text-align:center;
width:150px;
height:300px;
padding:10px;
border-radius:15px;
}

#footer {
clear:both;
background: rgb(167,207,223); /* Old browsers */
background: -moz-linear-gradient(top, rgba(167,207,223,1) 0%, rgba(35,83,138,1) 100%); /*

FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(167,207,223,1)),

color-stop(100%,rgba(35,83,138,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /*

Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /* Opera

11.10+ */
background: -ms-linear-gradient(top, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /* IE10+

*/
background: linear-gradient(to bottom, rgba(167,207,223,1) 0%,rgba(35,83,138,1) 100%); /*

W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a7cfdf',

endColorstr='#23538a',GradientType=0 ); /* IE6-9 */
color:#ffffff;
width:800px;
text-align:center;
border-bottom-left-radius:15px;
border-bottom-right-radius:15px;
padding:10px;
}

table.footer {
color:#ffffff;
width:800px;
text-align:center;
border-bottom-left-radius:15px;
border-bottom-right-radius:15px;
padding:10px;
}

#footer a {
color:#ffffff;
text-decoration:none;
}

h2 {
text-align:left;
font-size:20px;
color:#4AA4C7;
}


Tequila 02-28-2013 07:29 PM

I'm guessing table.content is the place where your content and sidefeed end up?

Try this:
PHP Code:

table.content {
background:#ffffff;
text-align:center;
vertical-align:top;
width:800px;


By telling it to align vertically at the top is the best way to work with tables. Unless you want them vertical middle and centered. ;3

Abronsyth 03-01-2013 06:52 PM

Thank you for the tip...but unfortunatley it's still not working properly :(
http://www.bellesombres.com/

Also now I'm getting a problem where on my online.php and my profile.php the text is enlarged, which makes for formatting problems.

At any rate, my footer problem is fixed!

Tequila 03-01-2013 10:00 PM

Odd... and it's too late now for me to look it over... (has to work at 7am EST... it's now 11pm est).

I'll take a look tomorrow after work.

Abronsyth 03-03-2013 04:22 PM

Thanks Tequila ;_; I'm sorry I'm such a pain in the butt to all you guys! I wish I had the money to pay someone to code a layout for me XD

Or at least find a website with free blank html layouts...I've been looking but can't seem to find any :/


All times are GMT -5. The time now is 06:53 PM.

Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2025, vBulletin Solutions Inc.