webcompat / web-bugs

A place to report bugs on websites.
https://webcompat.com
Mozilla Public License 2.0
747 stars 67 forks source link

www.reserveamerica.com - design is broken #15347

Closed dholbert closed 6 years ago

dholbert commented 6 years ago

URL: https://www.reserveamerica.com/camping/sunol/r/campgroundDetails.do?contractCode=EB

Browser / Version: Firefox Mobile 60.0 Operating System: Android 8.1.0 Tested Another Browser: Yes

Problem type: Design is broken Description: Text wraps mid-word Steps to Reproduce: Just visited the site & scrolled down. The first section ("Description") looks fine, but the rest look like they all have broken mid-word wrapping.

I'm guessing this might be word-break:break-word (https://bugzilla.mozilla.org/show_bug.cgi?id=1296042 ) or similar. Screenshot Description

From webcompat.com with ❤️

softvision-oana-arbuzov commented 6 years ago

Updated URL: https://www.reserveamerica.com/camping/sunol/r/campgroundDetails.do?contractCode=EB&parkId=110028

I was able to reproduce the issue. screenshot-1518169669367

Affected area:

<div class="content first">
    <h2>Description</h2>
    <span itemprop="description">Sunol Regional Wilderness is expected to remain open for day use during the San Francisco Public Utilities Commision project to improve its facilities at Calaveras Reservoir . However, there is no overnight camping at the Sunol Family Campsites or Group Campsites until further notice. The Sunol Backpack Camping Area remains open; advance reservation (5 business days/ phone only) and Ohlone Wilderness Permit is required for each person age 12 years or older.  Please visit the 
        <a href="http://www.ebparks.org/parks/sunol"> Sunol Park Page </a>  or call the EBRPD Reservations Department at 1-888-EBPARKS (1-888-327-2757) option 2 for more information.
    </span>
    <h4>Geography:</h4>
    <p>The Sunol Wilderness is located near Pleasanton, CA, on the southeastern side of San Francisco Bay. Under the East Bay Regional Park District's multi-use land management policy, cattle continue to gaze in the 6,859-acre wilderness.</p>
    <h4>Recreation:</h4>
    <p>Activities in the Sunol Wilderness include hiking, horseback riding, walking, backpack camping, and picnicking. Indian Joe Cave Rocks provides sport and challenge to rock climbers. Naturalists lead walks, hikes, trail rides, camping trips, and backpacking adventures, and other outings. Stop by the Old Green Barn Visitor Center for information about these programs and the self-guided Indian Joe Nature Trail. The Ohlone Wilderness Trail is a popular hiking destination; permits are available by phone, internet or at the Sunol Visitor Center (call ahead or check website for open hours).</p>
    <h4>Facilities:</h4>
    <p>Visitors should bring plenty of drinking water, because there is none available in the park.</p>
    <h4>Nearby Attractions:</h4>
    <p>The Sunol Wilderness is near many Northern California attractions. The cities of Oakland and Berkeley are about one hour away, and a longer drive takes visitors to either San Francisco or the Peninsula.</p>
</div>

Tested with: Browser / Version: Firefox Nightly Mobile 60.0a1 (2018-02-07) Operating System: Google Pixel (Android 8.1.0) - Resolution 1080 x 1920 pixels (~441 ppi pixel density)

Moving to Needsdiagnosis for further investigation.

karlcow commented 6 years ago

The CSS for the content is

.content a, #contentcol div p, .mobiDropDown, policyinfo p {
    word-break: break-all;
}

which is happening everywhere. :)

Also careful, we don't necessary the same version on all devices and it's not about user agent sniffing but more likely A/B testing.