[help] how to make the default theme 100% width??

[Soha 8084]

hello

here what I have done...

downloaded only girls theme and took the only girls img folder, header, and global.css and replace them with those of the default theme

IE 7 - FF - Google chrome all show the new theme and the default one as 100% width

but one of my frinds pc showed the theme as fixed (in the middle of the page) see the image attached
I couldn't know if it is IE 6 or 7 or 8 !!!!

I want to make it 100% width how ?? where is the code for that
Why it is fixed in some pc and other 100% width ???

please I really need the code for that

[Soha 8084]

come on guys !!!!

please help

[Tung]

In yourthemes/css/global.css, find the #page tab, try 93% replaced by 100%.

[daryl]

Why would you want to do that? if you set it to 100%, people who uses higher resolution screen will see each column distance wide apart.

[Soha 8084]

hello

thanks Tung for your help I downloaded a theme of yours earlier and liked it very much

daryl

yea you are right ! I wasn't clear in the title what I want is how to make the default theme liquid
meaning that it takes the width of any screen all coluns

to get red of the white distance before the right and left column

I did find a post here about a long way of changes but in the end they still didn't approved the changes where ok or it missed up on one screen!!

the weird thing I see it on my 1200 * 800 resolution HP laptop as liquid (as wide as the screen) but other people send me screen shots like the one attached here

I realy hope some one would give us the right way to do it
or at least a liquid theme that works with v1.0 to see what have been done there

[By Kuhi]

I am looking for 100% width Template,
But , I could not find
How can I do width Template?
Please the help...



The example web site
http://www.bebekmarket.com

[Paul C]

I started to have a play with a template with most of the formatting removed that was full width. I think it's 1.0. I've attached it here for anyone that wants to have a play with it... not sure it works though

Edit, tested it and it was an old version... will try and find the last one I did and post it....

Edit again; this is the one, but hardly any styling in it, so not really in a state you could use.... but may help by playing with it...

Paul

skeleton.zip

[Soha 8084]

Thanks Paul will take a look

but as you said not sure it works as a liquid theme

I know the diffrence between a fixed and liquid theme is that the later has stretch points in it where as fixed don't
stretch points don't have writing or graphics on them
so can that be done with the default theme

and I say default becuase we could modify any theme to the basic structure of the defaualt without worries it will affect function

thanks again

[Tung]

Good
The following code in my search for ideas to find the
We would like to help research





#page {
width: 93%;
text-align:left;
}
h1#logo {
float: left;
width: 29%;
margin-top:0.5em;
}
#header {
margin: 0 auto 0 auto;
height:100px;
width: 100%;
text-align: right;
}

/*---= Changed to 20% Width, and 25px right padding =---*/
#left_column {
float:left;
width:20%;
padding-right: 25px;
}

/*---= Added 10px Padding along with 60% width =---*/
#center_column {
float:left;
padding: 10px;
width: 60%;
}

/*---== Added padding to column and 10% width =---*/
#right_column {
float:left;
width: 10%;
padding: 15px 25px 10px 10px;
}











#page {
width: 980px;
margin: 0 auto 2px auto;
text-align:left;
}
h1#logo {
float: left;
width: 29%;
margin-top:0.5em;
}
#header {
float: left;
height:100px;
width: 71%;
text-align: right;
}
#left_column, #center_column, #right_column {
float:left;
}
#left_column {
clear:left;
width:180px;
padding-right: 10px;
}
#center_column {
width: 556px;
margin: 0 0 30px 0;
}
#right_column {
width: 180px;
padding-left: 0px;

[Soha 8084]

ok guys

I will apply the changes Tung provided to a test prestashop

but I need you to help me test it on all browsers and differant screen resolutions

if it is ok confirm and if something is not right report please so we would work all together to create a liquid presta theme

will post the link to the test shop in an hour

[Soha 8084]

just a REMINDER
we are working on V1.0

when we manage it will try it on V1.1

[Soha 8084]

well this is the link with the modification Tung posted

http://becute.net/prestasoso

please report is it liquid , what is your resolution , what browser you are viewing the site with

what do you suggest to modify

the only thing I modified on this copy of presta V1.0
global.css
all other original

tell you what to modify so we would all finally create a liquid theme for presta

any help is appreciated

I noticed that if you restore down the browser (IE 7) things overlay each other

[Paul C]

Hmm, I'm not sure what you guys are trying to do though.... just adding more whitespace to pad out the window isn't really creating an elastic design

You want all the elements to make use of the extra space surely, so you need to get rid of the fixed widths in the columns?

Paul

[Soha 8084]

you are right Paul this is what I have been trying to say:)

do you know how to make all elements use the space ?? do we need stretch points?? how to do that??

am not but a beginner girl in designing so we need the steps

anyone has a liquid theme as a point to start from???

any help appreciated

waiting for your replies and suggestions

[barje]

Find in your global.css this code and change or add what you need:

/* global layout */
#page {
   width: 100%;
}
#header {
   height:100px;
}
#left_column, #center_column {
   float:left;
}
#right_column {
   float:right;
}

/* Footer */
#footer {
   text-align: center;
}

I think this is what you are looking for.

Bye.

[Soha 8084]

hello barje

this is exactly what we have applied to the test shop which I deleted it right now

what it is not really liquid
all it did is that it made the columns far away from eac other
and when you restore the page the blocks override each other

still waiting for a total change

[levbilen]

hi,

which one is better?

a 100% width Template or a 70% width template like;

http://www.bebekvebebek.com

[shacker]

this is elastic theme and free

 

http://catalogo-onlinersi.net/es/plantillas-prestashop/358-prestashop-elastico.html