WordPress.org

Ready to get started?Download WordPress

Forums

Gridiculous
Nesting Columns (4 posts)

  1. anthonystal
    Member
    Posted 1 year ago #

    Hi,
    I was wondering if someone could help me with nesting columns. I have three rows of 6 images added in the style.css below the header widgets on the home page. Since page width is 12 columns, each image is 2 columns. I have tried several ways to make them nest nicely when shrinking the page, but have not found the right code. First, I just aligned 6 images in one row, each with row width c2. These looking nice and shrunk and expanded nicely, but all collapsed into one row after a certain page width when they could easy have stacked.

    Then I started with codes like the below, splitting each row into sections, first 2 sections of 6 columns, then 3 of 4, as below.

    <div class="grid">
    			<div class="row">
    				<div class="c6">
    					<div class="row">
    						<div class="c4"><a href="http://www.wwf.or.id/" target="_blank"><img src="/wp-content/uploads/client-logos/WWF.png"/></a>
    						</div>
    						<div class="c4 end"><img src="/wp-content/uploads/client-logos/EXPO.png"/></a>
    						</div>
    						<div class="c4 end"><a href="http://www.umn.ac.id/" target="_blank"><img src="/wp-content/uploads/client-logos/Client-List-v1_01.jpg"/></a>
    						</div>
    					</div>
    				</div>
    				<div class="c6 end">
    					<div class="row">
    						<div class="c4"><a href="http://www.wwf.or.id/" target="_blank"><img src="/wp-content/uploads/client-logos/WWF.png"/></a>
    						</div>
    						<div class="c4 end"><img src="/wp-content/uploads/client-logos/EXPO.png"/></a>
    						</div>
    						<div class="c4 end"><a href="http://www.umn.ac.id/" target="_blank"><img src="/wp-content/uploads/client-logos/Client-List-v1_01.jpg"/></a>
    						</div>
    					</div>
    				</div>
    			</div>
    		</div>

    but they do not expand to maximum width when nested, and at the same page width as before they all jump into one small column. I would like for the mobile users not to see 18 rows of one large icon, but perhaps 6 rows of 3 small ones. Please advise me, I would really endlessly appreciate it. Thanks so much! - Anthony

  2. anthonystal
    Member
    Posted 1 year ago #

    P.S. URL is http://www.synergycarbon.com. I sometimes block users cause its under construction though, so let me know if its the wrong theme or if its blocked. Thanks for the help!

  3. anthonystal
    Member
    Posted 1 year ago #

    URL is now up permanently. Please navigate to http://www.synergycarbon.com if you have a minute to help me nest those 18 client images properly. Thanks!!

  4. c.bavota
    Member
    Theme Author

    Posted 1 year ago #

    We discussed this one through email.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic