vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vB3 Design and Graphics Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=168)
-   -   how to put image-borders around forum (https://vborg.vbsupport.ru/showthread.php?t=256649)

aaron79 01-06-2011 09:00 PM
how to put image-borders around forum
 
like the title suggest i need help with image-borders. not borders around images, but actual background images that is repeated across x and y to give the illusion they are borders.

an example of what i want is http://www.hiveworkshop.com/


can anyone help?

Beav` 01-07-2011 11:18 PM
There's a couple of ways to do it, and it can depend on whether your site is a fixed width or fluid.

You can do with a tables with a bit of code in the header and footer. For example, in the header you'd have something like...

HTML Code:
<table style="width: 100%;border: 0;" cellpadding="0" cellspacing="0">
<tr>
<td><img src="path_to_top_left_corner_image" style="border: 0" alt="top left" /></td>
<td style="width: 100%;background: url('path_to_repeating_top_background_image') repeat-x;"></td>
<td><img src="path_to_top_right_corner_image" style="border: 0" alt="top right" /></td>
</tr>
</table>

<table style="width: 100%;border: 0;" cellpadding="0" cellspacing="0">
<tr>
<td style="background: url('path_to_left_side_background') repeat-y"></td>
<td style="width: 100%;vertical-align: top">

<!-- your forum will show in this cell... -->
and in the footer have something like...
HTML Code:
</td>
<td style="background: url('path_to_right_side_background') repeat-y"></td>
</tr>
</table>

<table style="width: 100%;border: 0;" cellpadding="0" cellspacing="0">
<tr>
<td><img src="path_to_bottom_left_corner_image" style="border: 0" alt="bottom left" /></td>
<td style="width: 100%;background: url('path_to_repeating_bottom_background_image') repeat-x;"></td>
<td><img src="path_to_bottom_right_corner_image" style="border: 0" alt="bottom right" /></td>
</tr>
</table>
You'll probably need some spacer images for the left and right background too.

There's other ways with div's and some absolute positioned images, but it all depends on your site layout and the background image you want to use.

aaron79 01-07-2011 11:48 PM
thank you so much! really appreciate it. :) great explanation and example too :)..


All times are GMT. The time now is 07:14 PM.

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

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01060 seconds
  • Memory Usage 1,723KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (2)bbcode_html_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (3)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 
Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete