Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > Welcome splash screen
Octomus (New Admin) 12/1/2010 9:03 AM EST : Welcome splash screen
Octomus
Posts: 16
Becoming Adept!

Hi there,

Im having a little trouble trying to have my Welcome splash screen aligned properly here is what it looks like at the moment

Any suggestions as to how to have it positioned properly ?

regards
TopBottom

Mottie (MVP) 12/1/2010 12:32 PM EST : RE: Welcome splash screen
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Hi Octomus!

Try not to use a table and other images to center content. It's best to just have the CSS do it for you. Try the code below, then read the instructions on how to customize it in this post.
<style type="text/css">
body { display:none; }
</style>

<div id="splashBox">
 <div align=center>
  <div style="height:10px;"></div> <!-- This is a spacer -->
  <img alt="" height="649" width="1000" src="http://www.axiomfiles.com/Files/383137/splash_01.jpg" />
  <br>
  <a href="http://www.guildportal.com/Guild.aspx?GuildID=383137&amp;TabID=3226840">
   <img alt="" height="69" width="173" src="http://www.axiomfiles.com/Files/383137/enter.jpg" style="border-width: 0px; border-style: solid;" />
  </a>
 </div>
<style type="text/css">
.StateBar, .BannerArea, .TabBar, .PageFooter, div.ContentBoxBody, .ContentBoxTitle, input  { display:none; }

body { background: #000; color: #ffffff; display: inline; }
img, img a { border:0px; }
</style>
</div>

<script type="text/javascript">
$(document).ready(function() {
var a = document.getElementById('splashBox').innerHTML;
document.getElementById('ctl00_ContentPlaceHolder1_PageContainer').innerHTML = a;
});
</script>
TopBottom

Octomus (New Admin) 12/2/2010 4:09 PM EST : RE: Welcome splash screen
Octomus
Posts: 16
Becoming Adept!

Hey Mottie,

Thanks for tryin to help me, you actually made me realise that i was seriously doing this the hard way lol

I simply went back to Dreamweaver and instead of slicing my image from photoshop i just imported the entire image as a JPEG and created a rectangular hotspot over the 'ENTER' button

Added my own CSS and the script you provided and hey presto

Check it out here

Once again thanks

Octo
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%