CSS - How to avoid squeezing of column when using percentage
-
-
- Peter Osipof
- Elite Rocketeer
- Posts: 1117
- Thanks: 0
- My pleasure, Although your solution fixed the issue, it broke list/grid effect, at first I wanted to release the theme to the community that is why decided to use percentage but now I opted for fixed width don't have time to troubleshoot.
- VirtueShop
-
-
-
- Peter Osipof
- Elite Rocketeer
- Posts: 1117
- Thanks: 0
-
I have another issue.
I have width of header section set 100% but for some reason it going outside of the main body/content area, (see image) any help fixing this issue is appreciated, direct link to site
This image is hidden for guests.
Please log in or register to see it. - VirtueShop
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
-
.browseParamContainer {
background-color:#F2F2F2;
border:1px solid #E3E3E3;
display:inline;
float:right;
margin-bottom:10px;
padding:10px;
width:92%; <-used to be 100%
} - Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it
- DanG
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
Tho Pär answer isn't wrong, I would add this instead:
div.browseParamContainer {padding: 0;}
div.browseSortByFormContainer form > div {padding: 10px;}
You are adding the padding at the wrong place. If you have a width of 100% the padding will be added. So you have to add it to a child item that is a block element but no width attached.
www.w3.org/TR/CSS2/box.html
btw that is why RT has the class .rt-block in its gantry templates ...
-
-
-
- Peter Osipof
- Elite Rocketeer
- Posts: 1117
- Thanks: 0
-
Henning, you are the man, thank you.
If you need any of the extensions from my site please let me know. - VirtueShop
-
-
-
- Peter Osipof
- Elite Rocketeer
- Posts: 1117
- Thanks: 0
-
I have come back with another question, I have the following
td#maincol ul li { padding-left: 20px; }
Which gives 20px padding to ul and li however I don't want the padding to apply to ul and li that are in a specific class named 'pagination'. - VirtueShop
-
-
-
- David Goode
- Preeminent Rocketeer
- Posts: 17058
- Thanks: 890
- Web Designer and Host
-
Hi Peter,
Try adding the following line as well as keeping the line you ...
.pagination td#maincol ul li { padding-left: 0; }
May need to play with size and path a bit. I always use Firefox and Firebug to test before saving files to server.
Hope this helps.
Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
-
-
-
- Peter Osipof
- Elite Rocketeer
- Posts: 1117
- Thanks: 0
-
Thank you, the code you wrote is the first thing I tried, it didn't work, however the following code with a comma works somewhat, I say somewhat because it effects even td#maincol ul li that aren't in pagination class.
.pagination, td#maincol ul li { padding-left: 0; } - VirtueShop
-
-
-
- David Goode
- Preeminent Rocketeer
- Posts: 17058
- Thanks: 890
- Web Designer and Host
-
Hi Peter,
OK - although it sounds a bit unusual try the code as...
...and see what happens..pagination { padding-left: 0;}
Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information
-
Time to create page: 0.069 seconds