Jump to content

Noz03

Members
  • Posts

    30
  • Joined

  • Last visited

Posts posted by Noz03

  1.  

    No! because the inline css styling on the page itself will have a higher precedence over the styling in external stylesheet.

     

    try

    body #bwg_container1_0 #bwg_container2_0 .bwg_slideshow_image_wrap_0 {
    background-color: #FFFFFF;
    }
    

    or

    #bwg_container1_0 #bwg_container2_0 .bwg_slideshow_image_wrap_0 {
    background-color: #FFFFFF !important;
    }
    

    Wohoo it worked! Thanks so much!

     

    Just wondering, how did you find it out? I am also trying to change the button colour but it's also not working. When I change it on the firefox inspector tool it changes on the page so should be the right code but won't change from custom.css, even when I put body before or !important after :/

    body #bwg_container1_0 #bwg_container2_0 .bwg_slideshow_dots_0 {
        background-color: #7A7A7A !important;
        background: #7A7A7A !important;
      }
    

    Screenshot012.jpg

  2. #bwg_container1_0 #bwg_container2_0 .bwg_slideshow_image_wrap_0 {

    background-color: #000000;

    border-collapse: collapse;

    display: table;

    position: relative;

    text-align: center;

    }

     

    Its on the page itself at line 154

    Unfortunately didn't work :'(

     

    added this to the custom.css file which should override anything before it:

    #bwg_container1_0 #bwg_container2_0 .bwg_slideshow_image_wrap_0 {
    background-color: #FFFFFF;
    }
    

    Should work right? :/

  3. So I am trying to find which CSS code to change for the background of the slideshow plugin I have on my page, but no matter how hard I try I can't seem to find it using the inspector tool, have been trying for over an hour now :(

     

    Could anyone help point me in the right direction!

     

    The page with the slider is http://dannorrisphotography.net/portraits/ Obviously I don't want the background of the slider to be black on a white page.

     

    PS sorry for being such a noob! :fool:

  4. Ok! I finally got it! I just added:

    @media screen and (max-width: 980px) {.col-c35{	width: 98%;}.col-c65{	width: 98%;}}

    to the css file and it now works!!One thing though... now that it is working I am thinking it is actually stacking it too soon, the sidebar disapears at 980 which is fine, but i dont want to items to stack until maybe around 750. how can I change this? I tried playing with float but honestly I dont even know where to put the float, i guess in the front-page.php? or in the css? Any suggestionsThanks again, really I spent 3 months with this problem!!! Am so happy its finally fixed :D

  5. Ok, but how do I make the items take up the full width of the screen when they drop down? They are still only taking up the % width that I give them even after they stack. Before I customized the theme they were 49/49% but after stacking they became 100%. I don't get why changing the 49/49 to 34/64 should affect the stacked width.

  6. Hey guys, I have been stuck on this problem for literally 3 months now! So I REALLY hope someone here might be able to help before I lose my mind!

     

    I am using a responsive wordpress theme which has a custom home page with 2 main cells which originally have the following style in the style.css file:

    .col-460 {    width: 48.936170212766%;}

    All I want to do is change the ratio so that the right box is larger than the left one, something like 65%/35% so I added this code to the style.css

    .col-c35{	width: 33.92%;}.col-c65{	width: 63.92%;}

    And changed the style of each box in front-page.php as such:

    	<div id="featured" class="grid col-940">		<div class="grid col-c35">			<p>				<?php				if ( isset( $responsive_options['home_content_area'] ) && $db && $empty )					echo do_shortcode( $responsive_options['home_content_area'] );				else					_e( 'Your title, subtitle and this very content is editable from Theme Option. Call to Action button and its destination link as well. Image on your right can be an image or even YouTube video if you like.','responsive' );				?>			</p>		</div><!-- end of .col-c35 -->		<div id="featured-image" class="grid col-c65 fit">

    It worked great on my screen, but when the screen size is small enough it decides to stack the boxes so that they will be easier to read on a mobile screen, however for some reason they still keep their % sizes so they are stacked but at 33% instead of changing to fill the screen. It's hard to explain but you can check the site and resize the window to see. http://thestupidforeigner.com

     

    Does anyone have any idea how I can fix this? Really, I have tried everything but I can't seem to work this out. I hope someone can help.

     

     

    Thanks a lot,

    -Dan

  7. I think I've been misunderstood. I WANT them to stack when it goes below a certain screen resolution so that it would suit a mobile screen better. BUT, since I changed the ratio between the featured image and the text, WHEN they stack it keeps the same % that I set instead of then going to 100% like it used to. Here is a screen shot of how it looks

     

     

     

    Before I changed the % in the css for the image and text it was automatically becoming 100% for both when it stacked for mobile screens. How can I get it to keep doing that?responsive-bug.jpg

  8. Sometimes, when calculating pixel sizes from percentages, the browser might round up, causing elements to stack because they're just one pixel too wide. You can change one of the numbers, instead of 35% you can make it something like 34.75%, or instead of 65% make it 64.75%

     

    Actually I also thought this might be the problem as the original was quite a bit lower than 100% total so I tried making it 34% and 64% but still same problem :(

  9. My site has a custom home page template which by default had 2 items, a text and an image. I changed the style of these 2 items to make the image bigger and the text smaller, but now when the site stacks the items for a responsive view the items don't automatically resize to fit the new space as they used to do before I made my changes. The site is http://thestupidforeigner.com if you resize your window you will see what I mean, it looks horrible. Any ideas why?

    I changed the style from

    .col-460 {    width: 48.936170212766%;}

    to

    .col-c35{    width: 35%;}.col-c65{    width: 65%;}

    If you need to see the php it's like this:

    	<div id="featured" class="grid col-940">			<div class="grid col-c35">									<p>				<?php				if ( isset( $responsive_options['home_content_area'] ) && $db && $empty )					echo do_shortcode( $responsive_options['home_content_area'] );				else					_e( 'Your title, subtitle and this very content is editable from Theme Option. Call to Action button and its destination link as well. Image on your right can be an image or even YouTube video if you like.','responsive' );				?>			</p>			        					</div><!-- end of .col-c35 -->		<div id="featured-image" class="grid col-c65 fit">
  10. I'm using wordpress and for some reason my themes blog page is set up horribly. I don't know why but they decided to make it show the thumbnail as a full size image above the post excerpt, but I want it to be just a standard style blog. I've been playing with the code and managed to get the thumbnail to a thumbnail size, but it is still showing ABOVE the excerpt, could anyone tell me how to get it to show them side by side (classic blog style)??the website is http://thestupidforeigner.com/blog

    The php code is:

    				<div class="post-entry">					<?php if ( has_post_thumbnail()) : ?>						<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >							<?php the_post_thumbnail(); ?>						</a>					<?php endif; ?>					<?php the_excerpt(__('Read more ›', 'responsive')); ?>					<?php wp_link_pages(array('before' => '<div class="pagination">' . __('Pages:', 'responsive'), 'after' => '</div>')); ?>				</div><!-- end of .post-entry -->			
  11. I'm trying to make some small changes to a wordpress page template and for the life of me can not understand what I am doing wrong!Before I started editing it was set up to display the left half with some text, and the right part with an image or slider. I put my slider in, but I want to make the right part larger and the left part smaller. Instead of 50/50 maybe something like 35/65. To me this should be as easy as just changing the "grid col-XXX" parts for each section but when I do it ends up putting the text on top and the image on the bottom! Why???

    <div id="featured" class="grid col-940">  <div class="grid col-460">	    <p>    <?php    if ( isset( $responsive_options['home_content_area'] ) && $db && $empty )	 echo do_shortcode( $responsive_options['home_content_area'] );    else	 _e( 'Your title, subtitle and this very content is editable from Theme Option. Call to Action button and its destination link as well. Image on your right can be an image or even YouTube video if you like.','responsive' );    ?>   </p>  	       </div><!-- end of .col-460 -->  <div id="featured-image" class="grid col-460 fit">       <?phpif( function_exists('FA_display_slider') ){    FA_display_slider(103);}?>		  </div><!-- end of #featured-image --></div><!-- end of #featured -->

  12. Not sure but I don't think so. Actually I'm using wordpress and trying to put it into one of their plugins. I know HTML and shortcodes work but this php wont. Thats why I figured I have to put it into some kind of file first.

  13. I am trying to use my slider which only gives me php code to manually put it but the place I want to put it doesnt accept PHP code. Whenever I put it nothing shows at all. Any suggestions? I guess I need to put it to a file somehow and use a shortcode or something like this... Unfortunately I'm quite a beginner at this kind of stuff :/in case its important the code is:

    <?phpif( function_exists('FA_display_slider') ){    FA_display_slider(103);}?>

  14. No I mean inside the caption box. With the bottem padding set to 0 it is much better than before, but still quite a large gap. Is there any way to make the caption box boarder come to just a few pixels under the text? Right now it is I guess almost 10 pixels gap under.

  15. Thanks, it worked quite well, no more <p>s randomly adding and so on :) Still has a bit of a gap under it though, I tried to change the code to

    padding: 5px 3px -5px;

    but it seems it doesnt allow negative values. Any way around that?

  16. Hey, Im back haha. Sorry for the really late reply again. I downloaded the ultimate tinyMCE plugin, and it really is awesome... but my wordpress still keeps putting extra p tags in and also deleting the div tag :facepalm:I enabled the options "Disable wpautop" & "Remove p and br quicktags", disabled the original text editor and am only using the MCE html editor... but still no luck. Any more suggestions? Sorry if you are getting so sick of me and my stupid problem, you can only imagine how close I am to throwing my computer against the wall right now haha.

  17. Hmmm, I did what it says line now says

    function wpautop($pee, $br = false) {

    but it still puts the linebreaks in :( Also I noticed it automatically removed the div code you gave me :(This is what the code will look like when I first put it in:

    [caption id="attachment_148" align="alignright" width="300"]<div class="image_box"><img class="size-medium wp-image-148 " title="Cows in Haridwar Market" src="http://localhost/wp-content/uploads/2013/02/India01-300x225.jpg" alt="Cows in Haridwar Market" width="300" height="225" /><p class="img_caption"><span class="caption_r"style="">McKay Savage</span><span>Hyderabad market</span></p></div>[/caption]

    Then after I look at visual editor one time:

    [caption id="attachment_148" align="alignright" width="300"]<img class="size-medium wp-image-148 " title="Cows in Haridwar Market" src="http://localhost/wp-content/uploads/2013/02/India01-300x225.jpg" alt="Cows in Haridwar Market" width="300" height="225" /> <br /><br /><p class="img_caption"><span class="caption_r">McKay Savage</span><span>Hyderabad market</span></p> [/caption]

    Div is gone and linebreaks appear :'(

  18. Well I was hoping just to put the div code directly into the [caption] shortcode, but anyway I have an even bigger problem... I just noticed while your code works, for some reason after I use it every time I go from the html editor to the visual editor it adds a line break above and below the <p class="img_caption"><span class="caption_r">Yajico</span><span>Indian curries</span></p> code! The damn spaces are attacking back :/ Any ideas how to stop this? Jeez I cant believe how hard it would be just to do some basic text font for the caption on wordpress :(

  19. Well the way I made it to work was to insert the image, fill in all the details (title, caption, etc.) on the wordpress image settings, then goto the html editor and paste the div tag just before the img code already there, remove the caption i wrote and put the p html code with the /div in its place. Is there any easier way than this using short codes and so on? I have more than 100 images on the site already and planning to upload 1000s over the next few months.

  20. Thank you so much!! It finally works! Seriously took about a week just for this tiny thing haha... I guess at least I am learning a lot from this time though.One last question, the way I got it to work was to put the code in manually to the html editor of the page. Would it be possible to put the image_box class directly into the [caption] short code so I wouldnt have to do it for every picture manually?

  21. Sorry for

    .img_caption {width: 300px;text-align:center;} .img_caption span { display:block;} .img_caption .caption_r {color: #808080; text-align:right; }

    <p class="img_caption"><span class="caption_r"style="">©Yajico </span><span>Curries in Hyderabad</span></p>

    The span are within a P element, so using single paragraph margins, instead of two, if you want space at top and bottom of this parargraph smaller adjust the top/bottom margins for this paragraph.

    Sorry for late reply, had to stop staring at this site for at least the weekend haha. And thanks so much I think I am starting to understand this stuff now. I used your code, also added margin-top: -8 and got rid of most of the spaces, but for some reason the bottom one is still there! caption_bottom_space.jpgTried adding hight: ***px after the width but nothing happened, also tried making margin-bottom -20, nothing happened. How can I get rid of this final space?? :(
×
×
  • Create New...