If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2

Thread: Need some help

  1. #1
    Junior Member
    Join Date
    Mar 2014
    Member #

    Need some help

    Hello and thank you for looking at my post...

    I am in need of some help. I built a website on Joomla 1.5 for a friend of mine who owns a pizza shop. Joomla is now at version 3.0 and the old template cannot be converted over. Long story short I have to a complete redesign of the site and learn Joomla 3.0 and make a new template altogether. However I have some questions

    This is how I would like it to look as this here

    the checker pattern should extend down the screen with the white area in the center being joomla's content area can vary in length depending on content from 1000 pixels in length to over 4,000 pixels in length so the page needs to stretch somehow

    here are my issues

    1. How do I get the checkboard pattern to stretch down the page without stretching the wood table area ? I want to maintain the same look at the top and then just have the checkerboard continue. would I load two background images using CSS ? having the wood have a transparency to accommodate the tablecloth (checkerboard) and then make the actual checkerboard pattern the entire background pattern stretched ?


    #example1 {
     width: 1600px;
     height: 900px;
     background-image: url(wood.png), url(checkerboard.png);
     background-position: ???
     background-repeat: no-repeat;

    2. can I stretch the background checkboard dynamically if I am also using like the example above from a 320px x 360px image ?

    3. How can I accomplish this and keep the load time extremely low as half of the visitors are on mobile platforms ?

    Thanks in advance for any help.


  3. #2
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Oklahoma City
    Member #
    959 times
    1. Layer a div on top of the wood background and use css transform to skew it:
    Put the pizza in another div of its own (or use pseudo-elements).
    2. You can but using what I said in the first point, you wouldn't have to.
    3. Use the smallest size image pattern you can get away with. Ditch the pizza on mobile using media queries.

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
All times are GMT -6. The time now is 03:54 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: