Archived

This topic is now archived and is closed to further replies.

  • 0

Resolved Remove Container from one Page only

Question

29 answers to this question

Posted · Report post

You can try

.page-id-25 .hentry { height:300px; }
or
.page-id-25 .hentry { height:300px !important; }

I??m not sure

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Rkazantsev, I've checked your link in firebug for you. It's not showing that the image is set up as a slider, but as a post within the page content area. Is this correct? You can removed the shadow/border and align the image with the left hand of the page with CSS, but the white background cannot be removed as it is saved within the picture. Is this what you mean't by remove the container? Please let me know and we can advise further on how to achieve the look you're after :) If you're looking to remove the white background from the image, you'll have to save the image as a transparent PNG using a photo editor like Photoshop.

Share this post


Link to post
Share on other sites

Posted · Report post

@batman Wow thanks they both work, need to tweak it a little. Some lines left behind. Bag to firebug, but getting near :)

Share this post


Link to post
Share on other sites

Posted · Report post

A little more

.page-id-25 .hentry {
	    height: 220px;
	    border: medium none;
	    box-shadow: none;}
and
.page-id-25 .hentry-pad {
	 background: none repeat scroll 0% 0% transparent !important;}

as always I??m not sure :)

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Jamie I used this css code in custom css to remove the box or container.( background-color: transparent!important; ) Which is good but it removes for all pages, I only want to remove the container for one page. Also after making the background transparent I still need to move my slider to the left and all the way up. For some reason can find away to do this. Ruben

Share this post


Link to post
Share on other sites

Posted · Report post

Hi jamie You can try something like .page-id-25 and then your code

Share this post


Link to post
Share on other sites

Posted · Report post

@batman Amazing this is perfect, it did the job. Just last thing, it leaves a white boarder on right and left side where the container use to be. Do you know how I can remove it? http://72.26.98.200/?page_id=25

Share this post


Link to post
Share on other sites

Posted · Report post

When trying that I get a LESS compile error and nothing changes, I tried page_id=25, ?page_id=25 and .page-id-25 with background-color: transparent!important; after it. Also any help on moving the slider to the left and up after I remove the container?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi again, try with

.page-id-25 .hentry-pad { border: none;}

;)

Share this post


Link to post
Share on other sites

Posted · Report post

Only an example. the format is

.page-id-25 .tbubble-pad {background-color: transparent !important}

I don??t find where you can insert {background-color: transparent !important} in your site with the firebug to remove the box. You see the space among transparent and !important too.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi You can try

#main {left: -30px;}

I??m not sure :)

Share this post


Link to post
Share on other sites

Posted · Report post

@batman Amazing THANK YOU! Its is perfect, need to change the top image size from 1020 to 1040 so its all the same size.. But perfect !!!! :)

Share this post


Link to post
Share on other sites

Posted · Report post

Hi rkazantsev Try with

.page-id-25 #gallery { width: 1038px;}
.page-id-25 .slide {width: 1040px;}

Thank you, I enjoy help ;)

Share this post


Link to post
Share on other sites

Posted · Report post

Hi, This is not a PageLines issue, this is custom code. Therefore, we are unable to provide assistance. However, from my quick look, the issue you have is the CSS. You currently have this:

#gallery {
	-moz-box-shadow: 0 0 3px #AAAAAA;
	-webkit-box-shadow: 0 0 3px #AAA;
	box-shadow: 0 0 3px #AAA;
	-moz-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
	border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	border-bottom-right-radius: 4px;
	border: 1px solid white;
	background: url(http://72.26.98.200/wp-content/uploads/2012/08/panel1040.png) repeat-x bottom center white;
	width: 1020px;
	overflow: hidden;
	}

Disabling the width in Chromes web dev tool, positioned your gallery correctly. Therefore, I recommend you review your code or ask the person who provided this functionality for assistance. Also, why not use the Carousel section ?

Share this post


Link to post
Share on other sites

Posted · Report post

batman as much as I would LOVE to make my life easier and paste that code, I cant since the image is sliced with a different hyper link over each image. The last time I changed the size via code the links were not working correctly, over lapping... But thank you so much. After I resize and map the image I think I am done... Hopefully

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites

Posted · Report post

batman #main {left: -30px;} worked like a charm, I tweaked it to #main {left: -40px;} and its perfect. Would you know how i can raise up? But transparency still doesnt work :( its all or nothing, and .page id 25 should work .page-id-25 .tbubble-pad {background-color: transparent !important}

Share this post


Link to post
Share on other sites

Posted · Report post

Missing a semi-colon:

{background-color: transparent !important;}

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks Danny, I tried removing the width: 1020px; from css, it does work but cut the image size to approximately 960

Share this post


Link to post
Share on other sites

Posted · Report post

If you need it to be a certain width, you can change the width itself.

Share this post


Link to post
Share on other sites

Posted · Report post

Ok got it lifted with the following custom css #main {left: -50px;top: -180px;} But still have the container, Also thanks Catrina tried with smi-colon but no luck

Share this post


Link to post
Share on other sites

Posted · Report post

I think if I can just change the size instead of making it transparent then it will be fine, (i.e.the container will be smaller or behind the image) But unable to do it via firebug

Share this post


Link to post
Share on other sites

Posted · Report post

You'll need to experiment with it to get it to where you want. I believe it's an issue with the selectors you may be using. What have you tried so far?

Share this post


Link to post
Share on other sites

Posted · Report post

@Catrina Unfortunately haven't been able to find the code that controls the size of the container. I tried .page-id-25 .content .box { width: 280px; min-width: 280px; } without success

Share this post


Link to post
Share on other sites

Posted · Report post

Try:

.page-id-25 .content .box {
	width: 280px !important;
	min-width: 280px !important;
	}

Share this post


Link to post
Share on other sites